body{
  background-color:rgb(249,249,249);
  color:#000;
  font-family: 'Oswald', Arial, Helvetica, sans-serif;
  font-size:1em;
  line-height:1.4em;
  font-weight:normal;
}


h1, h2, h3, h4, h5, h6{
  font-weight:400;
  font-family:'Oswald', Arial, Helvetica, sans-serif;
  line-height:1.5em;
  margin-top:20px;
  padding:0;
  clear:both;
}
.city-topic-icon {display:none; }
.city-topic-section {display:block}
h4 {color: #777; padding:0 10px}

.search-button {
    background: #f53300;
    border: none;
    margin-left: 5px;
    margin-right: 16px;
    font-size: 20px;
    width: 35px;
    height: 35px;
padding:0;
}

/* links */
a,
a:visited,
a:active,
a:hover{color:#307DA8; text-decoration:none;}
a:hover{color:#e00000; }
.topic_link{
padding:5px 10px;
float:left;
width: 254px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}


/* Box sizing. Awesome thing. Read about it here: http://www.w3schools.com/cssref/css3_pr_box-sizing.asp */
*{  box-sizing:border-box;
  -moz-box-sizing:border-box;}

/* structure */
.wrapper{
  width: 100%;
  margin: 0 auto;
}
header{
  padding:0;
}
#banner{
  text-align:center;
float:left;
}




#hero,
#page-header{
  background-color:#f3f3f3;


}
.image-header {
background-color: #030C10;
text-align: center;
}
.image-wrapper{
  width: 92%;
  margin: 0 auto;

}
#page-header h1{
  margin:0;
}

#content,
aside,
.vertical-padding{
  padding:8px 0;
}
p{
font-weight:normal;

font-size: 1em;
line-height: 1.5em;
margin: .45em 0;



}
.adcenter{padding:2px;border:1px #eee solid;background:#fff;clear:both;margin:5px 0;text-align:center}
.titlewrapper{ text-align: center;}
.shortdescription {display:none}
.magazinecategories{margin:5px 10px 10px 0;background:#fff;padding:0px;border:1px #eee solid;display:block; width:100%;  float:left}
.categorytitle2, .categorytitle2 a{    

    text-transform: uppercase;
    display: inline-block;
    letter-spacing: 1px;
    text-decoration: none;

    margin-top: 14px;
    float: left;
}
.categorytitle2 a:hover{color: #e00; }
.catimage {border-left:solid 10px #e00; float: left;}

.topic_menu a {padding:2px 5px; display:block; font-size:14px}
.topic_menu a:hover {color:#fff; background-color:#e00000}

.subtopic_menu a {padding: 3px 10px; display:block; margin:0 10px 0 20px; color:#555; font-size:14px}
.subtopic_menu a:hover {color:#fff; background-color:#092834}



.black {
  background-color: #023342;
  clear: both;
  height: 100px;
  background: url(/images/us_states.jpg) bottom right;
  background-repeat: no-repeat;
}
.black h2 {

  float: left;
  display: inline-block;
  margin-left: 55px;
  font-size: 24px;
  color: #C7E5FD;
  margin-top: 31px;
}
.back-to-top {
    position: fixed;
    bottom: 2em;
    right: 10px;
    text-decoration: none;
    color: #000000;
    background-color: rgba(0, 52, 84, 0.4);
    font-size: 12px;
    padding: 1em;
    display: none;
border-radius: 5px;
font-size: 26px;
  padding: 5px 7px 11px 7px;
color:#fff;

}

.back-to-top:hover {
    background-color: rgba(202, 186, 124, 0.6);
}


#indJobContent{padding-bottom: 5px;}
#indJobContent .company_location{font-size: 11px;overflow: hidden;display:block;}
#indJobContent.wide .job{display:block;float:left;margin-right: 5px;width: 135px;overflow: hidden}
#indeed_widget_wrapper{position: relative;font-family: 'Oswald',sans-serif;font-size: 13px;font-weight: normal;line-height: 18px;padding: 10px;height: auto;overflow: hidden;}
#indeed_widget_header{font-size:18px; padding-bottom: 5px; }
#indeed_search_wrapper{clear: both;font-size: 12px;margin-top: 0px;padding-top: 2px;}
#indeed_search_wrapper label{font-size: 12px;line-height: inherit;text-align: left; margin-right: 5px;}
#indeed_search_wrapper input[type='text']{width: 100px; font-size: 11px; }
#indeed_search_wrapper #qc{float:left;}
#indeed_search_wrapper #lc{float:right;}
#indeed_search_wrapper.stacked #qc, #indeed_search_wrapper.stacked #lc{float: none; clear: both;}
#indeed_search_wrapper.stacked input[type='text']{width: 150px;}
#indeed_search_wrapper.stacked label{display: block;padding-bottom: 5px;}
#indeed_search_footer{width:295px; padding-top: 5px; clear: both;}
#indeed_link{position: absolute;bottom: 1px;right: 5px;clear: both;font-size: 11px; }
#indeed_link a{text-decoration: none;}
#results .job{padding: 1px 0px;}
#pagination { clear: both; }
#indeed_widget_wrapper{ width: 300px; height: 600px; background: #ffffff;}
#indeed_widget_wrapper{ border: 1px solid #FFFFFF; }
#indeed_widget_wrapper, #indeed_link a{ color: #000000;}
#indJobContent, #indeed_search_wrapper{ border-top: 1px solid #FFFFFF; }
#indJobContent a { color: #307DA8; }
#indeed_widget_header{ color: #222222; }




.top10mag, .mag{  padding: 5px;
  border: 1px #eee solid;
  background: #fff;
  margin: 10px 10px 30px 0px;
  font-size: 14px;
  color: #333;
  width: 310px;
  float: left;}
.mag{
  width: 220px;
 }

.Top10 {
    font-family: 'Oswald', sans-serif;
    background-color: #EEB500;
    font-size: 25px;
    color: #fff;
    padding: 8px 2px;
    text-align: center;
    display: inline-block;
    float: left;
    width: 36px;
    height: 36px;
    margin-right: 10px;
    margin-bottom: 5px;
}
.magtitle {

  text-transform: uppercase;
  padding: 5px;
  height: 50px;
  font-size: 18px;
}

.bestseller_mag{  padding: 5px;
  border: 1px #eee solid;
  background: #fff;
  margin: 10px 6px 10px 12px;
  font-size: 14px;
  color: #333;
  width: 174px;
  float: left;
  height: 320px;
 }
.subscribe a {
display: block;
  background-color: #e00000;
  color: #fff;
  text-transform: none;
  padding: 1px;
  width: 198px;
  margin: 4px 0;
  text-align: center;

}
.subscribe_large a {
  display: block;
  background-color: #e00000;
  color: #fff;
  text-transform: none;
  padding: 2px;
  width: 115px;
  margin: 5px 0px 5px 0;
  text-align: center;
}

#subscribe_circle {
display:none;
margin: -252px 0 0 98px;
  padding-bottom: 147px;
  z-index:999}

.mag_image:hover #subscribe_circle {
  display: block;


}
.mag_image:hover{
  opacity:0.9

}




.scroll {
height: 110px;
width: 98%;
overflow: auto;
color:#4c4c4c;



}

 .scroll2 {
height: 135px;
width: 98%;
overflow: auto;

}

 .scroll-city {
height: 300px;
width: 98%;
overflow: auto;

}


.country-data {display:block; float:left; width:300px;  margin-bottom:6px}
.country-newspapers, .country-newspapers-side{float:left; display:block; margin-right:10px}
.country-newspapers-side{
  background-color: #fff;
  border: 1px #eee solid;
  padding: 5px;
  margin-bottom:10px}

.country-newspapers  {width:95%};
 .city {
    border-bottom: 2px solid #e00000;
  padding: 5px;
    margin: 30px 0 10px 0;}

 .city a,  .city a:hover, .city a:visited{color:#000}

 .city-menu{

  font-size: 14px;
  clear: both;
  text-align: right;
  margin: -7px 0px 15px 5px;
 }

     .city-menu a,  .city-menu a:visited
   {
    color: #fff;

  background-color: #092834;
  padding: 1px 10px;}

  .city-menu a:hover{  background-color: #e00000;}



  .arrow{width: 27px;
  height: 27px;
  color: #fff;
  background-color: #e00000;
  text-align: center;
  display: inline-block;
  padding: 1px;}
/* RESPONSIVE IMAGES  */
img{ max-width:100%; max-height:100% }




.truncate {
  width: 110px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}












.uppercase{text-transform: uppercase;}


.newlink {
    display: block;
    clear: both;
    border-radius: 6px;
    box-shadow: 1px 1px 1px rgba(0, 0, 0, .1);
    padding: 5px;
    border: 1px #eee solid;
    background: #fff;
    width: 100%;
    height: 48px;
    margin: 10px 0;
}



















/*MAIN MENU*/
.menu-toggle{
  display:block;
  padding:10px;
  margin:20px 0 0;
  background:#f53300;
  color:#fff;
  cursor:pointer;
  text-transform:uppercase;
  font-size:32px;
}
.menu-toggle.toggled-on{
  background:#f53300;

}
.srt-menu{
  display:none;
}
.srt-menu.toggled-on{
  display:block;
  position:relative;
  z-index:10;

}

.srt-menu{
  clear:both;
  margin-bottom:0px;
  font-family:'Oswald', Arial, Helvetica, sans-serif;
}
.srt-menu li a {
  color:#fff;

  display:block;

  padding:10px;
  text-decoration:none;
text-transform:uppercase;
  font-size:14px;
}
.srt-menu li a:hover{
  background:#f53300;
  color:#fff;
}
.srt-menu li li a {
  background:#333;
  padding-left:40px;
}
.srt-menu li li li a {
  background:#efefef;
  padding-left:80px;
}

/*SECONDARY MENU*/
#secondary-navigation{
  margin-bottom:10px;
background: #0f2d3c;
margin-bottom: 10px;
z-index: 9;
position: relative;
padding:15px 15px 30px 15px;
border-radius: 10px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
-o-border-radius: 10px;
border-right: 10px solid #f00;
}
#secondary-navigation ul{
  margin:0;
  padding:0;
}
#secondary-navigation ul li a{

  color:#fff;
  display:block;
  margin:2px 10px;

  text-decoration:none;
  border-bottom:1px solid #3e4755;
  font-family:'Oswald', Arial, Helvetica, sans-serif;
}
#secondary-navigation ul li a:hover,
#secondary-navigation ul li.current a{


zoom: 1;
filter: alpha(opacity=50);
opacity: 0.85;
-webkit-transition: opacity .15s ease-in-out;
-moz-transition: opacity .15s ease-in-out;
-ms-transition: opacity .15s ease-in-out;
-o-transition: opacity .15s ease-in-out;
transition: opacity .15s ease-in-out;

}

/*SPACE GRID ELEMENTS VERTICALLY, SINCE THEY ARE ONE UNDER ANOTHER SO FAR*/
.grid_1,
.grid_2,
.grid_3,
.grid_4,
.grid_5,
.grid_6,
.grid_7,
.grid_8,
.grid_9,
.grid_10,
.grid_11,
.grid_12 {
  margin-bottom:0px;
}

.left_column {display:none}
.hp_left_column {display:block; margin:0 15px 20px 0px}
.nav_column{background-color:#fff; float:left; display:block; margin-top: 36px;border-left:6px #ddd solid;width: 100%}
#main_column{margin:16px 0 0 0px; padding:0 5px;overflow:hidden }
#nav {

  list-style: none;
margin-left:-46px;


}
#ddmenu{
  text-align: center;
  display: block;
  padding: 4px;
  margin: 0 0 10px 0px;

}
.top10link {
padding: 3px 0;
border: 1px rgba(220, 220, 220, 0.5) solid;
background: #fff;
border-radius: 3px;
box-shadow: 1px 1px 1px rgba(0, 0, 0, .1);
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
-o-border-radius: 3px;
float: left;
width: 90px;
margin: 0 0px 20px 34px;
height: 90px;
text-align:center;
}



.add-remove-options {
float: right;
    margin-top: -75px;
    margin-right: -30px;
    background-color: #fff;
    width: 28px;
    height: 29Px;
    border-top-right-radius: 15px;
    border-bottom: 1px #eee solid;
    border-right: 1px #eee solid;
    border-top: 1px #eee solid;
    border-bottom-right-radius: 15px;
    padding: 1px;
    cursor: pointer;

    background-color: #fdfdfd;
}

.add-remove-options:hover {


    background-color: rgba(211, 241, 255, 0.57);
}

.sitelogo{height: 50px; width:84px; display:block; margin: 0 auto}
.favicon{height: 32px; width:32px; margin:  8px 0 }

.sitelisting{
display:block;
border-top:1px #e6e6e6 dashed;
margin-top:1px;
overflow:hidden;
height:33px;
}
.sitelisting a {
font-size:10px;
line-height:1em;
width:86px;

display:block;

}

h2, h2 a, h2 a:hover {
  font-size: 16px;
  display: block;
  /* letter-spacing: 1px; */
  line-height: 1.2em;
  vertical-align: baseline;
  margin: 0px 0 20px 0;
  padding: 3px 9px;
  font-weight: normal;
  color: #fff;
  border-left: 25px solid #f53300;
  background-color: #092834;
}

h3, h3 a, h3 a:hover{  font-family: 'Oswald', sans-serif;
  font-size: 14px;
  color: #170707;
  margin: 40px 0 20px 0;
  display: block;
  clear: both;
  font-weight: normal;
  border-bottom: rgb(224, 0, 0) 2px solid;
  padding: 0 5px;
text-transform: uppercase;

}
.navcontinent a {color:#FFffff;
font-size:0.9em;
  padding: 3px;
  float: left;
  margin-right: 10%;
  margin-left: 10%;
  color: #fff;
  width: 90%;
}
.hidenow{display:none; }
#logo{width:90px;height:90px}

.flat-mega-menu > ul > li > a {

  color: #FFFFFF;
  text-align: left;
  width: 100%;
  padding: 12px;
  font-size: 14px;
  background-color: rgb(9, 40, 52);
}

.flat-mega-menu {

z-index: 999;
    /* float: right; */
    margin: 0;
    padding: 0;
    position: relative;
    display: block;
    max-width: 1280px;
    /* min-width: 180px; */

}

/*FOOTER*/
footer{
  background-color: #0B1F27;
  color:#eee;
        font-family:'Oswald', Arial, Helvetica, sans-serif;
  padding:20px 0;
  border-top:3px solid #b3b3b3;
  font-size: 90%;
  margin-top: 30px;
}
footer ul{
  margin:0 0 0 8%;
  padding:0;
}
footer a{color:#eee;text-decoration:none;}
footer a:visited{color:#eee;text-decoration:none;}
footer a:hover {color: #bbb;}
.footer-copy{margin-bottom:20px}
.footer-links{}
.footer-text{}



/* Contain floats: h5bp.com/q */
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }



/****************************************
*****************************************
MEDIAQUERIES
*****************************************
****************************************/



/*
LARGER MOBILE DEVICES
This is for mobile devices with a bit larger screens.
*/
@media only screen and (min-width: 761px) {
#banner{
  float:left;
  text-align:left;

  margin-top:0px;
}

.menu-toggle{/*make menu float right, instead of sitting under the logo*/
  margin-top:68px; /*this depends on the height of the logo*/
  float:right;
}

.flexslider{
  display:block;
/*demo 1 slider theme*/
margin: 0;
}

#pantext{font-size: 24px; }
}




h1 {font-family: 'Oswald', sans-serif; color: #000; font-size: 24px; display:inline-block;text-transform:uppercase}






@media only screen and (min-width: 761px) {


.city-topic-icon {float:left;display:block; width:100px}

.city-topic-section {float:right;display:block; width:500px}
.flat-mega-menu > ul > li > a {

  color: #FFFFFF;
  text-align: left;
  width: 100%;
  padding: 7px 10px;
  font-size: 14px;
  background-color: rgb(9, 40, 52);
  border-right: 14px solid #092834;

}
  .hidenow{display:block}
.flat-mega-menu {padding-top:28px; padding-left: 7px; float: right;}
}


/*
TABLET & SMALLER LAPTOPS
The average viewing window and preferred media query for those is 768px.
But I think that some more breathing space is good:)
*/
@media only screen and (min-width:960px) {




.country-newspapers {width:620px; }
.country-newspapers-side {width:312px; }
.mag{width:220px}
.top10mag, .mag{height:665px }
.mag{height: 500px;
  margin-left: 10px; }
 #crumb{ margin-left: 150px;}

.footer-copy{float:left}
.footer-links{float:right}
.footer-text{float:left; margin-left:20px}
.shortdescription {font-family: Georgia, serif; font-style:italic; text-align: center; color:#777; font-size:18px; display: block; padding: 20px 40px 0 40px; clear:both}

#ddmenu{display:none}

.top10link {
padding: 3px 0;
border: 1px rgba(220, 220, 220, 0.5) solid;
background: #fff;
border-radius: 6px;
box-shadow: 2px 2px 2px rgba(0, 0, 0, .1);
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
-o-border-radius: 6px;
float: left;
width: 110px;
margin: 0 4% 3.5% 1%;
height: 110px;
text-align:center;
}

.add-remove-options {
    margin-top: -95px;
}
.sitelogo{height: 60px; width:100px; display:block; margin: 0 auto}
.favicon{height: 32px; width:32px; margin:  13px 0 }

.sitelisting{
display:block;
border-top:1px #e6e6e6 dashed;
margin-top:1px;
overflow:hidden;
height:43px;
}
.sitelisting a {
font-size:12px;
line-height:1.1em;
margin-top:2px;
width:106px;
display:block;
}


h2, h2 a, h2 a:hover {  font-size: 24px;
  display: block;
  letter-spacing: 1px;
  line-height: 1.2em;
  vertical-align: baseline;
  margin: 40px 0 20px 0;
  padding: 8px 16px;
  font-weight: normal;
  color: #000;
  color: #FFF;
  border-left: 40px solid #f53300;
  background-color: #092834  }

h3, h3 a, h3 a:hover{font-family: 'Oswald', sans-serif;font-size:14px; margin: 40px 0 20px 0; display: block; clear:both;font-weight: normal;  border-bottom: rgb(224, 0, 0) 2px solid;}
a .navcontinent a {color:#FF9B00;
  padding: 10px 0;
  margin-left: 6px;


}

#logo{width:120px;height:120px; margin-top:15px}

#nav {


  list-style: none;



}

.flat-mega-menu {
    padding-top: 28px;
padding-left: 7px;
float: right;

}





.flat-mega-menu > ul > li > a {
  color: #FFFFFF;
  text-align: left;
  width: 100%;
  padding: 7px 10px;
  font-size: 14px;
    border-right: 14px solid #092834;
}
.left_column{float:left; display:block; width:200px}
.hp_left_column{float:left; display:block; width:200px}
#nav_column_index{background-color:#fff; float:left; display:block; margin-top: 36px;border-left:6px #ddd solid;width: 61px;}
#main_column_index{margin:16px 0 0 55px; padding:0 10px;overflow:hidden;  }

.title-line-left{left: 0px; background-image: none; display: inline-block;height: 1px; line-height: 40px; position: relative; background-color:#000;margin-top: -21px;
vertical-align: middle;width: 65px;zoom: 1;}
.title-line-right{left: 0px; background-image: none; display: inline-block;height: 1px; line-height: 40px; position: relative; background-color:#000; top: 50%;margin-top: -21px; vertical-align: middle;width: 65px;zoom: 1;}
h1 {font-size: 40px; display:inline-block;letter-spacing: 1px; line-height: 1.2em; text-align: center; vertical-align: baseline; margin: 30px 0; padding:1px 20px;font-weight: normal;text-transform:uppercase;}


#main_column{ padding:0 10px;overflow:hidden;  }
.wrapper{
  max-width: 960px;
  margin: 0 auto;
}
header{
  padding:0;
}
#banner{
  float:left;
  text-align:left;

  margin-top:-15px;
}
#hero{
  padding:0;
}
#hero .grid_4 { width: 100%; }
#hero .grid_8 { width: 80%; margin:40px 10% 0;}

#content {
  float:left;
  width:65%;

  padding-left:20px;
}
#content.wide-content{
  float:none;
  width:100%;
}

.flexslider{
  display:block;
/*demo 1 slider theme*/
margin: 0;
}
.flex-control-nav {bottom: 5px;}


aside {
  float:right;
  width:35%;
}
#pantext{font-size:36px}
/*** MAIN MENU - ESSENTIAL STYLES ***/
.menu-toggle{display:none;}
#menu-main-navigation{display:block;}

.srt-menu, .srt-menu * {
  margin:     0;
  padding:    0;
  list-style:   none;
}
.srt-menu ul {
  position:   absolute;
  display:none;
  width:      12em; /* left offset of submenus need to match (see below) */
}
.srt-menu ul li {
  width:      100%;
}
.srt-menu li:hover {
  visibility:   inherit; /* fixes IE7 'sticky bug' */
}
.srt-menu li {
  float:      left;
  position:   relative;
  margin-left:1px;
  height:25px;
}
.srt-menu li li {
  margin-left:0px;
  height:auto;
}
.srt-menu a {
  display:    block;
  position:   relative;
}
.srt-menu li:hover ul,
.srt-menu li.sfHover ul {
  display:block;
  left:     0;
  top:      42px; /* match top ul list item height */
  z-index:    99;
  -webkit-box-shadow:  2px 3px 2px 0px rgba(00, 00, 00, .3);
    box-shadow:  2px 3px 2px 0px rgba(00, 00, 00, .3);
}
ul.srt-menu li:hover li ul,
ul.srt-menu li.sfHover li ul {
  top:      -999em;
}
ul.srt-menu li li:hover ul,
ul.srt-menu li li.sfHover ul {
  left:     12em; /* match ul width */
  top:      0;
}
ul.srt-menu li li:hover li ul,
ul.srt-menu li li.sfHover li ul {
  top:      -999em;
}
ul.srt-menu li li li:hover ul,
ul.srt-menu li li li.sfHover ul {
  left:     10em; /* match ul width */
  top:      0;
}







/*** DEMO2 SKIN ***/
#topnav, .srt-menu {
  float:right;
  margin: 1.96em 0 0 0;

}
.srt-menu a {
  text-decoration:none;
}
.srt-menu li a{


  padding:10px 20px;
}
.srt-menu a, .srt-menu a:visited  { /* visited pseudo selector so IE6 applies text colour*/
  color:      #fff;
}
.srt-menu li li a {
    border-top:   1px solid rgba(255,255,255,.2);
    background:   #333; /*fallback for old IE*/
    background:rgba(0,0,0,.6);
    color:  #fff;
    padding-left:20px;
}
.srt-menu li li a:visited{color:#fff;}
.srt-menu li li li a,
.srt-menu li.current * li a{
  padding-left:20px;
  background:rgba(0,0,0,.6);
}

.srt-menu li:hover > a,
.srt-menu li.current a{
  color:#fff;
  background:#f53300;
}
.srt-menu li li:hover > a{
  color:#fff;
  background:#f53300;
}



/*GRID*/
/*
 & Columns : 12

 */
.grid_1 { width: 5%; }
.grid_2 { width: 14%; }
.grid_3 { width: 22%; }
.grid_4 { width: 32%; }
.grid_5 { width: 38.333333333333%; }
.grid_6 { width: 48.3333333%; }
.grid_7 { width: 55%; }
.grid_8 { width: 63.333333333333%; }
.grid_9 { width: 71.666666666667%; }
.grid_10 { width: 82.5%; }
.grid_11 { width: 88.333333333333%; }
.grid_12 { width: 96.666666666667%; }

.grid_1,
.grid_2,
.grid_3,
.grid_4,
.grid_5,
.grid_6,
.grid_7,
.grid_8,
.grid_9,
.grid_10,
.grid_11,
.grid_12 {
  margin-left: 0px;

  float: left;

}

.alpha{margin-left:0px;}
.omega{margin-right:0px;}
.rightfloat{float:right;}
/* @
 * tinyfluidgrid.com
 & girlfriendnyc.com
 */

}

/*
DESKTOP
This is the average viewing window. So Desktops, Laptops, and
in general anyone not viewing on a mobile device. Here's where
you can add resource intensive styles.
*/
@media only screen and (min-width: 1024px) {
  #hero .grid_4 { width: 30%; }
  #hero h1{ font-size:1.4em;}
  #hero .grid_8 { width: 63.333333333333%; margin:0 1.6666666666667%; }
}

/*
LARGE VIEWING SIZE
This is for the larger monitors and possibly full screen viewers.
*/
@media only screen and (min-width: 1240px) {
  #hero h1{ font-size:2em;}
}

/*
RETINA (2x RESOLUTION DEVICES)
This applies to the retina iPhone (4s) and iPad (2,3) along with
other displays with a 2x resolution.
*/
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
       only screen and (min--moz-device-pixel-ratio: 1.5),
       only screen and (min-device-pixel-ratio: 1.5) {
}

/*
iPHONE 5 MEDIA QUERY
iPhone 5 or iPod Touch 5th generation styles (you can include your own file if you want)
*/
@media (device-height: 568px) and (-webkit-min-device-pixel-ratio: 2) {

}

/*
PRINT STYLESHEET
*/
@media print {

  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; } /* h5bp.com/t */
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
}


#header-container{    
    background: #092834;
    min-height: 90px;
    z-index: 999;
    height: 90px;
    position: fixed;
    width: 100%; }
.category a, .category a:visited  {text-decoration:none;color:#1F4B6F;font-size: 1.5em;font-family:'Oswald', Arial, Helvetica, sans-serif;display:block;padding:10px;line-height:1.3em; }
.categoryhome a, .categoryhome a:visited  {text-decoration:none;color:#1F4B6F;font-size: 1em;font-family:'Oswald', Arial, Helvetica, sans-serif;display:block;padding:10px;line-height:1em; }

.category a:hover, .categoryhome a:hover {color:#fff; background:#f53300;
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
-o-border-radius: 3px;}
.link{padding:5px;border:1px #eee solid;background:#fff;clear:both;margin:5px 0 10px 0px; }
.ad{padding:5px;border:1px #eee solid;background:#fff;clear:both;margin:10px 0 }






#secondary-navigation ul li a label {
float: right;
color: #242424;
background: #ffffff;
padding: 5px 8px;
cursor: pointer;
border-radius: 2px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
-o-border-radius: 2px;
margin-top:4px;
}

#secondary-navigation ul li a span {float: left;padding: 10px}

.clear {clear: both;}


.grey{
background:#eee url(/images/noise.jpg);


}
.continent{
background: #fafafa;
/* border-top: 2px solid #FF0000; */
/* border-bottom: 2px solid #FF0000; */
border-left: 10px solid #FF0000;
/* border-right: 10px solid #FF0000; */
border-radius: 10px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
-o-border-radius: 10px;
padding-top: 1px;
}

.continent-home {
background: #ffffff;
border-top: 3px solid #f53300;
border-left: 1px rgb(234, 234, 234) solid;
border-right: 1px rgb(234, 234, 234) solid;
border-bottom: 1px rgb(234, 234, 234) solid;
box-shadow: 2px 2px 2px rgba(0, 0, 0, .1);
}



#statecities{
border: 1px rgb(234, 234, 234) solid;
background-color: rgb(255, 255, 255);
padding: 6px;
box-shadow: 2px 2px 2px rgba(0, 0, 0, .1);
margin-bottom:30px;
}


.side_continent{
background: #fafafa;
/* border-top: 2px solid #FF0000; */
/* border-bottom: 2px solid #FF0000; */
border-right: 10px solid #FF0000;
/* border-right: 10px solid #FF0000; */
border-radius: 10px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
-o-border-radius: 10px;
padding-top: 1px;
margin-top:20px;
}

.icon{display:block; margin:-27px auto}
.continent_content{padding:0px 10px 28px 10px}
.continent_content p a {padding:5px 10px;display: block; text-decoration: none;}
.continent_content p a:hover{color:#fff; background:#f53300;
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
-o-border-radius: 3px;
}

.more {margin-bottom:20px}

.more a {color:#fff; background:#f53300; text-decoration: none;
float:right;
padding:5px 20px;
margin:10px;
clear:both}


.logowrapper{padding:5px;border:1px #eee solid;background:#fff;clear:both;margin:5px 0 10px 0px; display:block; height:80px}
.logolink {margin-top:20px}

.logolink a{font-family:'Droid Serif', Arial, Helvetica, sans-serif;font-size:16px; color: #307DA8;text-decoration: none; height:80px}
.logolink a:hover{color:#f53300;}
.logoimage {float: left; padding-right:10px}


aside{margin-top:3px; margin-bottom: 10px; z-index:9;position:relative; padding:30px 18px}




























#nav li{

    border-left: solid 6px #ddd;

    padding: 2px 0 2px 7px;

    display:block;

}





#nav li a{

font-size:12px;
    color: #555;
display:block;
}


#nav li:hover, #nav li.current  {
    background-color: #ededed;
    border-left: solid 6px #f53300;
color: #333;
        display:block;

}







}






















#panorama{background-repeat:no-repeat; background-position:right top; background-size: auto; width: 920px; height: 200px}
#pantext{font-family: 'Oswald', sans-serif;

text-transform: uppercase;
color: #fff;
padding-bottom: 18px;
display: block;
/* text-align: right; */
opacity: 0.75;
margin-top: -133px;
}
.largephoto-disc{font-family: 'Oswald', sans-serif;font-size:8px; text-transform:uppercase;float:right; color:#777;margin-right:10px; margin-top:-1px;clear:both}
.refmore a{font-family: 'Oswald', sans-serif;font-size:13px; text-transform:uppercase; color:#ED1C24; float:right; text-decoration:none}
.refback a{font-family: 'Oswald', sans-serif;font-size:13px; text-transform:uppercase; color:#ED1C24;  text-decoration:none;  padding-top: 5px; display:block; margin:20px 0 30px 0}
.refcitylisting, .refcitylisting a, .refcitylisting a:hover,.refcitylisting a:visited{ color: #307DA8;text-decoration: none; font-family: 'Oswald', Arial, Helvetica, sans-serif;}


.adref{padding:5px;border:1px #eee solid;background:#fff;clear:both;margin:5px 5px 5px 60px}
.ad a, .adref a{color: #307DA8;text-decoration: none;font-family: 'Oswald', Arial, Helvetica, sans-serif;}

.ad300 a,.reflisting, .reflisting a, {text-decoration: none; font-weight: normal;}

.toclisting, .toclisting a{font-family: 'Oswald', sans-serif;font-size:13px; text-transform:uppercase; color: #f53300;text-decoration: none; display:block; padding:3px}
.toclisting a:hover {color:#fff;  background-color:#f53300 }

.largephoto{margin-top:30px;}
.largephoto-disc{ffont-family: 'Oswald', sans-serif;
font-size: 11px;
text-transform: none;
float: center;
color: #000;
margin-right: 10px;
margin-top: -1px;
clear: both;

opacity: 0.75;}
.population{background: #fbfbfb}
.pop{color: #000;
  font-family: 'Oswald', sans-serif;
  font-size: 18px;
  padding-left: 10px;
  display: block;
  clear: both;
  text-align: left;}
.poplarge{color:#ef6b33;font-family: 'Oswald', sans-serif;font-size:24px;  text-align: right; margin: 0 10px 20px 0; display: block;line-height: 1.2em;}
.popmedium{color:#ef6b33;font-family: 'Oswald', sans-serif;font-size:24px;  text-align: right; margin-right: 10px; display: block;padding-top: 15px;line-height: 1.2em;}
.coa{text-align: center;}



.disc{font-family: 'Oswald', sans-serif;font-size:14px; text-transform:uppercase; text-align: center; color: #888; display: block; height: 14px; line-height: 14px; margin: 40px 0 2px 0; text-align: center; text-transform: uppercase; clear:both}


.titlewrapper{margin-top:10px }

#crumb {font-family: 'Oswald', sans-serif;font-size:12px; text-transform:uppercase; margin-top: 96px; }
#crumb a, #crumb a:visited, #crumb a:hover{color: #307DA8;text-decoration: none;}


#AZCities li { float:left; list-style:none; }
#AZCities a {font-family: 'Oswald', sans-serif;font-size:14px; color:#307DA8; text-transform:uppercase; display:block; width:170px; margin: 0 4px; padding:2px; text-decoration:none; }
#AZCities a:hover {color:#fff;  background-color:#f53300 }


.NCities a {font-family: 'Oswald', sans-serif;font-size:14px; color:#307DA8;  display:block;  margin: 0 4px; padding:2px; text-decoration:none; text-align:left}
.NCities a:hover {color:#fff;  background-color:#f53300 }

#AZCitiesLarge li { float:left; list-style:none; }
#AZCitiesLarge a {font-family: 'Oswald', sans-serif;font-size:14px; color:#307DA8; text-transform:uppercase; display:block; width:170px; margin: 0 4px; padding:2px; text-decoration:none; }
#AZCitiesLarge a:hover {color:#fff;  background-color:#f53300; }


.AZCitiesLarge {font-family: 'Oswald', sans-serif;font-size:14px; color:#ef6b33; text-transform:uppercase; display:block; width:170px; margin: 0 4px; padding:2px; text-decoration:none; }
.AZCitiesLarge a:hover {color:#fff;  background-color:#f53300 }

.listNav { margin:0 0 10px; }

.ln-letters { overflow:hidden; }
.ln-letters a { font-family: 'Oswald', sans-serif;font-size:14px; text-transform:uppercase;  display:block; float:left; padding:1px 6px; border:2px solid #fff; border-right:none; text-decoration:none; color: #fff; background:#bc2424;}
.ln-letters a.ln-last { border-right:0px solid #fff; }
.ln-letters a:hover,
.ln-letters a.ln-selected {background-color:#f53300;  }
.ln-letters a.ln-disabled { color:#ccc; }



.caticon {float: left; border: 1px #eee solid;margin: -5px 20px 7px 10px; padding:3px; background:#fff; clear:left}

.citymain{float:left; width:600px }


    #maswrapper
    {
      max-width: 37em;
      margin: 0 auto;
    }
      #list
      {
        width: 103.125%; /* 990px */
        overflow: hidden;
        margin-left: -1.562%; /* 15px */
        margin-bottom: -1.875em; /* 30px */
      }
        .item
        {
          width: 30%;

          float: left;
          margin: 0 1.515% 1.875em; /* 15px 30px */
        }

    @media only screen and ( max-width: 40em ) /* 640px */
    {
      .item
      {
        width: 46.876%; /* 305px */
        margin-bottom: 0.938em; /* 15px */
      }
    }

    @media only screen and ( max-width: 20em ) /* 320px */
    {
      #list
      {
        width: 100%;
        margin-left: 0;
      }
        .item
        {
          width: 100%;
          margin-left: 0;
          margin-right: 0;
        }
    }


.section
{
text-align: center;
margin-top: -14px;
display: block;

}






.navcontinent a:hover {color:#f53300}



/* reset */
.flat-mega-menu ul,
.flat-mega-menu li,
.flat-mega-menu a,
.flat-mega-menu p,
.flat-mega-menu img,
.flat-mega-menu h2 {
  margin: 0;
  padding: 0;
  display: block;
  line-height: normal;
  text-decoration: none;
  list-style: none;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

/* menu container */


/* ul tag layout */
.flat-mega-menu > ul {
  float: left;



}

/* li tag layout */
.flat-mega-menu > ul > li {
  float: left;

  color: #FFFFFF;

}

/* a tag layout */


/* .title class layout */
.flat-mega-menu > ul > .title > a {
  text-transform: uppercase;
  font-size: 1.4em;
  line-height: 60px;
  padding-left: 20px;
  text-align: left;
  padding-right: 20px;
}

.flat-mega-menu > ul > .title {
  border-left: none;
  min-width: 25%;
}

/* .login-form class */
.flat-mega-menu ul .login-form {
  min-width: 6%;
  text-align: center;
  cursor: pointer;
  float: right;
  padding-left: 10px;
  padding-right: 10px;
  position: relative;
}

.flat-mega-menu .login-form table,
.flat-mega-menu .login-form tbody {
  width: 100%;
}

.flat-mega-menu .login-form input {
  width: 100%;
  margin: 0 0 3px;
  padding: 0 10px;
  display: block;
  border-radius: 3px;
  background-color: rgb(244, 244, 244);
  box-shadow: inset 0.5px 1px 3px 0px rgba(0,0,0,0.10);
  -webkit-box-shadow: inset 0.5px 1px 3px 0px rgba(0,0,0,0.10);
  border: none;
  height: 30px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  outline: none;
}

.flat-mega-menu .login-form input[type=submit] {
  border: 1px solid rgba(0,0,0,0.15);
  border-radius: 3px;
  opacity: 0.81;
  box-shadow: inset 0.5px 0.866px 0px 0px rgba(255, 248, 68, 0.106);
  background: #2888d2;
  color: #FFFFFF;
  height: 35px;
  width: 100px;
  font-size: 1em;
  font-family: "nunito regular";
  margin-top: 10px;
  cursor: pointer;
  outline: none;
}

.flat-mega-menu .login-form input[type=submit]:hover {
  opacity: 1;
}

.flat-mega-menu .login-form input[type=checkbox] {
  float: left;
  display: block;
  height: 35px;
  width: auto;
  cursor: pointer;
  outline: none;
  background-color: #FFFFFF;
}

.flat-mega-menu .login-form label {
  color: #7D7D7D;
  font-family: "nunito regular";
  font-size: 0.8em;
  font-weight: normal;
  height: 35px;
  display: block;
  margin: 10px 0 0;
  padding: 0 0 0 0px;
  line-height: 35px;
  white-space: nowrap;
  cursor: pointer;
  -webkit-user-select: none;
  -ms-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
}

.flat-mega-menu .login-form ul {
  position: absolute;
  right: 0px;
  width: 300px;
  padding: 15px 15px 10px;
}

.flat-mega-menu .login-form:hover {
  background-color: #FFFFFF;
  color: #2888D2;
  /* animation */
  transition: background 0.3s linear 0s, color 0.3s linear 0s;
  -moz-transition: background 0.3s linear 0s, color 0.3s linear 0s;
  -ms-transition: background 0.3s linear 0s, color 0.3s linear 0s;
  -o-transition: background 0.3s linear 0s, color 0.3s linear 0s;
  -webkit-transition: background 0.3s linear 0s, color 0.3s linear 0s;
}

/* .search-bar class */
.flat-mega-menu ul .search-bar {
  min-width: 6%;
  text-align: center;
  cursor: pointer;
  float: right;
  padding-left: 10px;
  padding-right: 10px;
}

.flat-mega-menu .search-bar:hover {
  background-color: #FFFFFF;
  color: #2888D2;
  /* animation */
  transition: background 0.3s linear 0s, color 0.3s linear 0s;
  -moz-transition: background 0.3s linear 0s, color 0.3s linear 0s;
  -ms-transition: background 0.3s linear 0s, color 0.3s linear 0s;
  -o-transition: background 0.3s linear 0s, color 0.3s linear 0s;
  -webkit-transition: background 0.3s linear 0s, color 0.3s linear 0s;
}

.flat-mega-menu .search-bar ul {
  position: absolute;
  right: 0;
  width: 50%;
}

.flat-mega-menu .search-bar table,
.flat-mega-menu .fa-user tbody {
  width: 100%;
}

.flat-mega-menu .search-bar table tr td:last-child {
  width: 120px;
}

.flat-mega-menu .search-bar ul input[type=text] {
  background-color: #FFFFFF;
  box-shadow: inset 0px 0px 2px 0px rgba(0,0,0,0.55);
  -webkit-box-shadow: inset 0px 0px 2px 0px rgba(0,0,0,0.55);
  border: none;
  padding: 10px;
  width: 100%;
  float: left;
  border-right: 10px solid rgba(0,0,0,0.00);
  border-left: 20px solid rgba(0,0,0,0.00);
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  height: 40px;
  outline: none;
}

.flat-mega-menu .search-bar ul input[type=submit] {
  border: none;
  width: 85%;
  cursor: pointer;
  font-size: 0.9em;
  font-family: "nunito regular";
  float: left;
  height: 40px;
  outline: none;
  border: 1px solid rgba(0,0,0,0.15);
  opacity: 0.81;
  box-shadow: inset 0.5px 0.866px 0px 0px rgba(255, 248, 68, 0.106);
  background: #2888d2;
  color: #FFFFFF;
}

.flat-mega-menu .search-bar ul input[type=submit]:hover {
  opacity: 1;
  outline: none;
}

/* hover animation */
.flat-mega-menu > ul > li:hover > a {
 /* background: #f53300; */

}

.flat-mega-menu > ul > .title:hover > a {
  background: inherit;
  color: inherit !important;
}

/*------- Drop down layout start ------*/
.flat-mega-menu .drop-down {
  position: absolute;
    border-top:   1px solid rgba(255,255,255,.2);
    background:   #333; /*fallback for old IE*/
    background:rgba(0,0,0,1);
    color:  #fff;

  z-index: 999;


  float: left;

width:100%;
  padding: 0px;
  margin: 0 auto;


}

.flat-mega-menu .drop-down .drop-down {
  border-top: 1px solid rgba(0,0,0,0.10);
}

.flat-mega-menu .drop-down li {
  float: left;
  width: 100%;
  position: relative;
}

.flat-mega-menu .drop-down li a {
  color: #555658;
  font-size: 0.9em;
  text-align: left;
  padding: 10px 20px 10px 25px;

}

/* drop down hover animation */
.flat-mega-menu .drop-down li:hover > a {
  color: #000000;
  padding-left: 30px;
}

/* default hover animation to show drop down */
.flat-mega-menu > ul > li:hover .drop-down {
  display: block;
}

.flat-mega-menu ul li .drop-down li:hover > .drop-down {
  display: block;
}

/* .hover-fade animation to show drop down */
.flat-mega-menu > ul > li .drop-down.hover-fade {
  display: none;
}

.flat-mega-menu > ul > li:hover > .drop-down.hover-fade,
.flat-mega-menu > ul > li .drop-down li:hover > .drop-down.hover-fade {
  display: block;

}

@keyframes hover-fade {0% {opacity:0;}100% {opacity:1;}}
@-moz-keyframes hover-fade {0% {opacity:0;}100% {opacity:1;}}
@-ms-keyframes hover-fade {0% {opacity:0;}100% {opacity:1;}}
@-o-keyframes hover-fade {0% {opacity:0;}100% {opacity:1;}}
@-webkit-keyframes hover-fade {0% {opacity:0;}100% {opacity:1;}}

/* .hover-zoom animation to show drop down */
.flat-mega-menu > ul > li .drop-down.hover-zoom {
  display: none;
}

.flat-mega-menu > ul > li:hover > .drop-down.hover-zoom,
.flat-mega-menu > ul > li .drop-down li:hover > .drop-down.hover-zoom {
  display: block;
  /* keyframes animation */
  animation: hover-zoom 0.2s linear 0s forwards;
  -moz-animation: hover-zoom 0.2s linear 0s forwards;
  -ms-animation: hover-zoom 0.2s linear 0s forwards;
  -o-animation: hover-zoom 0.2s linear 0s forwards;
  -webkit-animation: hover-zoom 0.2s linear 0s forwards;
}

@keyframes hover-zoom {0% {opacity:0; transform: scale(0.8, 0.8);} 100% {opacity:1; transform:scale(1.0, 1.0);}}
@-moz-keyframes hover-zoom {0% {opacity:0; -moz-transform: scale(0.8, 0.8);} 100% {opacity:1; -moz-transform:scale(1.0, 1.0);}}
@-ms-keyframes hover-zoom {0% {opacity:0; -ms-transform: scale(0.8, 0.8);} 100% {opacity:1; -ms-transform:scale(1.0, 1.0);}}
@-o-keyframes hover-zoom {0% {opacity:0; -o-transform: scale(0.8, 0.8);} 100% {opacity:1; -o-transform:scale(1.0, 1.0);}}
@-webkit-keyframes hover-zoom {0% {opacity:0; -webkit-transform: scale(0.8, 0.8);} 100% {opacity:1; -webkit-transform:scale(1.0, 1.0);}}

/* .hover-expand animation to show drop down */
.flat-mega-menu > ul > li .drop-down.hover-expand {
  display: none;
}

.flat-mega-menu > ul > li:hover > .drop-down.hover-expand,
.flat-mega-menu > ul > li .drop-down li:hover > .drop-down.hover-expand {
  display: block;
  /* keyframes animation */
  animation: hover-expand 0.2s linear 0s forwards;
  -moz-animation: hover-expand 0.2s linear 0s forwards;
  -ms-animation: hover-expand 0.2s linear 0s forwards;
  -o-animation: hover-expand 0.2s linear 0s forwards;
  -webkit-animation: hover-expand 0.2s linear 0s forwards;
}

@keyframes hover-expand { 0% {opacity:0; transform: rotateY(90deg);} 100% {opacity:1; transform:rotateY(0deg);}}
@-moz-keyframes hover-expand { 0% {opacity:0; -moz-transform: rotateY(90deg);} 100% {opacity:1; -moz-transform:rotateY(0deg);}}
@-ms-keyframes hover-expand { 0% {opacity:0; -ms-transform: rotateY(90deg);} 100% {opacity:1; -ms-transform:rotateY(0deg);}}
@-o-keyframes hover-expand { 0% {opacity:0; -o-transform: rotateY(90deg);} 100% {opacity:1; -o-transform:rotateY(0deg);}}
@-webkit-keyframes hover-expand { 0% {opacity:0; -webkit-transform: rotateY(90deg);} 100% {opacity:1; -webkit-transform:rotateY(0deg);}}

/* fontAwesome icons layout */
.flat-mega-menu .drop-down li i {
  position: absolute;
  z-index: 999;
  top: 0;
  right: 20px;
  bottom: 0;
  height: 16px;
  margin: auto;
  color: #555658;
}

/* level 2 .drop-down layout */
.flat-mega-menu .drop-down .drop-down {
  left: 100%;
  top: -10px;
  width: 150px;
}

/*------- one column layout ----------*/
.flat-mega-menu .drop-down.one-column {
  width: 230px;
}

.flat-mega-menu .drop-down .drop-down.one-column {
  width: 200px;
}

/*-------- two column layout ---------*/
.flat-mega-menu .drop-down.two-column {
  width: 322px;
}

.flat-mega-menu .drop-down.two-column ul {
  float: left;
  width: 160px;
  margin: 0;
  padding: 0;
}

/*--------- .full-width with 4 columns layout -----------*/
.flat-mega-menu .drop-down.full-width {

  left: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
padding:20px;
}

.flat-mega-menu .drop-down.full-width ul {
  float: left;
  width: 25%;
  cursor: default;
}

.flat-mega-menu .drop-down.full-width ul li {
  margin: 0;
  padding: 1px 0;
  float: left;
  width: 100%;
}

.flat-mega-menu .drop-down.full-width ul li a {
  margin: 0;
  border: none;
  padding: 3px;
  float: left;
  margin-right: 10%;
  margin-left: 10%;
  color:#fff;

  width:90%
}


/* hover animation */
.flat-mega-menu .drop-down.full-width ul li:hover a {
  background-color:#f53300;
}

.flat-mega-menu .drop-down.full-width ul li p {
  margin: 0;
  padding: 10px 10px 10px 11%;
  float: left;
  width: 100%;
  clear: both;
  font-size: 0.9em;
  color: #949598;
}

/*---------- drop down with .social-bar class -------*/
.flat-mega-menu .drop-down.social-bar {
  width: 200px;
}

/* hr tag layout */
.flat-mega-menu hr {
  margin: 0;
  padding: 0;
  display: block;
}

/* image layout
.flat-mega-menu img {
  width: 100%;
  float: left;
  border-style: solid;
  border-width: 4px;
  border-color: rgb(255, 255, 255);
  background-color: rgb(235, 235, 235);
  box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.078), inset 0px 0px 76px 0px rgba(0, 0, 0, 0.039);
}

/* image hover animation */
.flat-mega-menu img:hover {
  opacity: 0.8;
}

/* h2 layout */
.flat-mega-menu h2 {
  color: #535456;
  font-size: 1.2em;
  font-weight: normal;
  margin: 0;
  padding: 5px 5px 5px 10%;
  padding-top: 15px;
  padding-bottom: 10px;
}

/* .social-bar class layout */
.flat-mega-menu .social-bar {
  position: relative;
}

.flat-mega-menu .social-bar ul {
  width: 262px;
  padding: 10px;
  position: absolute;
  background-color: #FFFFFF;
  border-bottom: 3px solid;
  border-bottom-color: #2888D2;
  right: 0;
}

.flat-mega-menu .social-bar ul li {
  float: left;
  width: 40px;
  height: 40px;
  margin: 10px;
  padding: 0;
}

.flat-mega-menu .social-bar ul a {
  margin: 0;
  padding: 0;
  display: block;
  height: 40px;
  width: 40px;
  position: relative;
}

.flat-mega-menu .social-bar ul a i {
  text-align: center;
  padding: 0;
  margin: 0;
  height: 40px;
  width: 40px;
  position: absolute;
  top: 0;
  left: 0;
  border: 1px solid rgba(0,0,0,0.10);
  line-height: 40px;
  border-radius: 5px;
  color: #797979;
  font-size: 1.3em;
  border-radius: 4px;
  background-image: -moz-linear-gradient(90deg, rgba(233,233,233,1.00) 0%, rgba(233,233,233,1.00) 100%);
  background-image: -webkit-linear-gradient(90deg, rgba(233,233,233,1.00) 0%, rgba(233,233,233,1.00) 100%);
  background-image: -ms-linear-gradient( 90deg, rgb(240,240,240) 0%, rgb(243,243,243) 100%);
  background-image: -o-linear-gradient(90deg, rgba(233,233,233,1.00) 0%, rgba(233,233,233,1.00) 100%);
  background-image: linear-gradient(0deg, rgba(233,233,233,1.00) 0%, rgba(233,233,233,1.00) 100%);
}

.flat-mega-menu .social-bar ul a:hover i {
  background: #C7C7C7;
  color: #000000
}

/* mobile button hide in desktop mode */
.flat-mega-menu > label,
.flat-mega-menu > input {
  display: none;
}

/* media query */
@media screen and (max-width:760px) {

  /* li tag layout */
  .flat-mega-menu > ul > li {
    width: 100%;
    border-left: none !important;
    border-right: none !important;
    border-bottom: 1px solid;
    border-bottom-color: #1F3749;
  }

  .flat-mega-menu > ul > li:hover > a,
  .flat-mega-menu > ul > .login-form:hover,
  .flat-mega-menu > ul > .search-bar:hover{
      color: #ffffff !important;
  }

  /* .title class layout */
  .flat-mega-menu > ul > .title a {
    text-align: center;
  }

  /* .full-width class layout */
  .flat-mega-menu .drop-down.full-width {
    position: relative;
    left: 0px !important;
    padding: 0px;
  }

  /* all drop-downs layout */
  .flat-mega-menu .drop-down.one-column,
  .flat-mega-menu .drop-down.two-column,
  .flat-mega-menu .drop-down.full-width,
  .flat-mega-menu .drop-down .drop-down,
  .flat-mega-menu .social-bar ul,
  .flat-mega-menu .search-bar ul,
  .flat-mega-menu .login-form ul {
    width: 100% !important;
    display: block !important;
    position: relative;
    left: 0px;
    transform: scale(1.0, 1.0), rotateY(90deg);
    -moz-transform: scale(1.0, 1.0), rotateY(90deg);
    -ms-transform: scale(1.0, 1.0), rotateY(90deg);
    -o-transform: scale(1.0, 1.0), rotateY(90deg);
    -webkit-transform: scale(1.0, 1.0), rotateY(90deg);
  }

  .flat-mega-menu .drop-down .drop-down {
    border: none;
    border-top: 1px solid #E8E8E8;
    border-bottom: 1px solid #E8E8E8;
    top: 0;
    padding: 0;
  }

  .flat-mega-menu .drop-down .drop-down.one-column {
    padding-left: 20px;
  }

  .flat-mega-menu > ul > li .drop-down.hover-expand,
  .flat-mega-menu > ul > li .drop-down.hover-fade,
  .flat-mega-menu > ul > li .drop-down.hover-zoom {
    display: none;
    border: none;
  }

  .flat-mega-menu > ul > li:hover > .drop-down.hover-expand,
  .flat-mega-menu > ul > li:hover > .drop-down.hover-fade,
  .flat-mega-menu > ul > li:hover > .drop-down.hover-zoom,
  .flat-mega-menu > ul > li .drop-down li:hover > .drop-down.hover-expand,
  .flat-mega-menu > ul > li .drop-down li:hover > .drop-down.hover-fade,
  .flat-mega-menu > ul > li .drop-down li:hover > .drop-down.hover-zoom {
    display: block;
    /* keyframes animation */
    animation: hover-default 0.2s linear 0s forwards;
    -moz-animation: hover-default 0.2s linear 0s forwards;
    -ms-animation: hover-default 0.2s linear 0s forwards;
    -o-animation: hover-default 0.2s linear 0s forwards;
    -webkit-animation: hover-default 0.2s linear 0s forwards;
  }

  .flat-mega-menu > ul > .login-form:hover,
  .flat-mega-menu > ul > .search-bar:hover,
  .flat-mega-menu > ul > li:hover > a {
    color: #FFFFFF;

  }

  .flat-mega-menu ul .login-form,
  .flat-mega-menu ul .search-bar {
    margin: 0;
    padding: 0;
  }

  .flat-mega-menu ul .login-form label {
    text-align: left;
    text-indent: 10px;
  }

  .flat-mega-menu ul .login-form table td {
    cursor: default;
  }

  .flat-mega-menu .drop-down.two-column ul,
  .flat-mega-menu .drop-down.full-width ul {
    width: 100%;
  }

  .flat-mega-menu .drop-down.one-column a,
  .flat-mega-menu .drop-down.two-column a {
    width: auto;
    float: left;
  }

  .flat-mega-menu ul .social-bar {
    text-align: center;
  }

  .flat-mega-menu ul .social-bar ul li {
    display: inline-block;
    float: none;
  }

  /* fontAwesome icons layout */
  .flat-mega-menu .drop-down li .fa.fa-angle-right {
    position: relative;
    z-index: 9999;
    right: 0px;
    float: right;
    height: auto;
    color: #555658;
    padding: 0;
    margin: 0 17px 0 0;
    display: block;
    line-height: 38px;
    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
  }

  /* mobile button layout */
  .flat-mega-menu #mobile-button {
    position: absolute;
    display: none;
  }

  .flat-mega-menu > ul {
    height: 0;
    overflow: hidden;
  }

  /* mobile button click to show drop down */
  .flat-mega-menu #mobile-button:checked + ul {
    height: auto;
    overflow: scroll;
    bottom: 0;
    left: 0;
    right: 0;
    top: 90px;
    position: fixed;
  }

  /* label tag layout */
.flat-mega-menu > label {
background-color: #f53300;
    display: inline-block;
    padding: 5px 10px 8px 9px;
    float: right;
    cursor: pointer;
    margin: 28px 18px 0 7px;
}

  .flat-mega-menu > label i{
    -ms-user-select:none;
    -moz-user-select:none;
    -o-user-select:none;
    -webkit-user-select:none;
  }

  .flat-mega-menu ul .title {
    padding-left: 60px;
  }

  /* collapse class layout */
  .flat-mega-menu .collapse .drop-down.one-column,
  .flat-mega-menu .collapse .drop-down.two-column,
  .flat-mega-menu .collapse .drop-down.full-width,
  .flat-mega-menu .collapse .drop-down.full-width.international,
  .flat-mega-menu .collapse .drop-down .drop-down,
  .flat-mega-menu .collapse .social-bar ul,
  .flat-mega-menu .collapse .search-bar ul,
  .flat-mega-menu .collapse .login-form ul {
    width: 100% !important;
    /* display: none !important; */
    position: relative;
    left: 0px;
    transform: scale(1.0, 1.0), rotateY(90deg);
    -moz-transform: scale(1.0, 1.0), rotateY(90deg);
    -ms-transform: scale(1.0, 1.0), rotateY(90deg);
    -o-transform: scale(1.0, 1.0), rotateY(90deg);
    -webkit-transform: scale(1.0, 1.0), rotateY(90deg);
  }

  .flat-mega-menu > .collapse > li:hover > .drop-down.hover-expand,
  .flat-mega-menu > .collapse > li:hover > .drop-down.hover-fade,
  .flat-mega-menu > .collapse > li:hover > .drop-down.hover-zoom,
  .flat-mega-menu > .collapse > li .drop-down li:hover > .drop-down.hover-expand,
  .flat-mega-menu > .collapse > li .drop-down li:hover > .drop-down.hover-fade,
  .flat-mega-menu > .collapse > li .drop-down li:hover > .drop-down.hover-zoom {
    display: block !important;

  }

  @keyframes hover-fade { 0% {opacity:0;} 100% {opacity:1}}
  @-moz-keyframes hover-fade { 0% {opacity:0;} 100% {opacity:1}}
  @-ms-keyframes hover-fade { 0% {opacity:0;} 100% {opacity:1}}
  @-o-keyframes hover-fade { 0% {opacity:0;} 100% {opacity:1}}
  @-webkit-keyframes hover-fade { 0% {opacity:0;} 100% {opacity:1}}

}

/* media query */
@media screen and (max-width:320px) {

  /* ul tag layout */
  .flat-mega-menu .drop-down.two-column ul,
  .flat-mega-menu .drop-down.full-width ul {
    width: 100%;
  }

  /* .search-bar layout */
  .flat-mega-menu ul .search-bar td {
    width: 100% !important;
    float: left;
    padding: 5px 20px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    cursor: default;
  }

  .flat-mega-menu ul .search-bar input[type=text],
  .flat-mega-menu ul .search-bar input[type=submit] {
    width: 100%;
    margin: 0;
    border: none;
  }

  /* .login-form layout */
  .flat-mega-menu ul .login-form ul {
    padding: 20px;
  }

  .flat-mega-menu ul .login-form td {
    float: left;
    width: 100%;
    cursor: default;
  }

  .flat-mega-menu ul .login-form input[type=submit] {
    width: 100%;
  }

  /* .title class layout */
  .flat-mega-menu ul .title {
    padding-left: 0px;
    text-indent: 60px;
  }
}

#login .social-buttons {
  text-align: center;
}
#login .social-buttons img {
  width: 300px;
  padding-right: 4px;
  padding-bottom: 12px;
  display: block;
  margin: 0 auto;
}


#login-left {
  float: left; width: 50%;
  padding: 25px;
/*  background:red;*/
}
#login-right {
  float: left; width: 50%;
  padding: 25px;
  /*background:green;*/
}

#login-right button {
   width: 30%;
}

#forgotPassword2:link, #registerLink2:link,
#forgotPassword:link, #registerLink:link,
#forgotPassword:active, #registerLink:active,
#forgotPassword2:active, #registerLink2:active,
#forgotPassword:visited, #registerLink:visited,
#forgotPassword2:visited, #registerLink2:visited,
#loginLink:visited, #loginLink:visited, .loginLink:visited, .loginLink:visited,
#loginLink:active, #loginLink:active, .loginLink:active, .loginLink:active,
#loginLink:link, #loginLink:link, .loginLink:link, .loginLink:link {
  color: #afb9c8;
  font-size: 0.8em;
}


.checkbox {
  color: #afb9c8;
  font-size: 0.8em;
}

@media (max-width: 650px) {
  #login-left {
    clear:both; width: 100%;
    padding: 25px;
  /*  background:red;*/
  }
  #login-right {
    clear:both; width: 100%;
    padding: 25px;
    /*background:green;*/
  }
}


#login-right h4 {
  margin-top: 0px; padding-top: 0px;
  text-transform: uppercase;
}

input[type="text"],
input[type="date"],
input[type="datetime"],
input[type="email"],
input[type="number"],
input[type="search"],
input[type="time"],
input[type="url"],
input[type="password"],
textarea,
select
{
    -webkit-transition: all 0.30s ease-in-out;
    -moz-transition: all 0.30s ease-in-out;
    -ms-transition: all 0.30s ease-in-out;
    -o-transition: all 0.30s ease-in-out;
    outline: none;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    width: 100%;
    background: #fff;
    margin-bottom: 2%;
    border: 1px solid #ccc;
    padding: 1%;
    color: #555;
    font: 95% Arial, Helvetica, sans-serif;
}
input[type="text"]:focus,
input[type="date"]:focus,
input[type="datetime"]:focus,
input[type="email"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="time"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus
{
    box-shadow: 0 0 5px #43D1AF;

    border: 1px solid #43D1AF;
}

input[type="submit"], input[type="button"], button[type="submit"], button[type="button"] {
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    width: 100%;
    padding: 6px;
    background: #9ebcd6;

    color: #fff;
    border: 0;
}

input[type="submit"]:hover,
input[type="button"]:hover,
button[type="submit"]:hover,
button[type="button"]:hover{
    background: #307da8;
}
/* end custom form styling */


#login-right h4 {
  margin-top: 0px; padding-top: 0px;
  text-transform: uppercase;
}

input[type="submit"].pull-right,
input[type="button"].pull-right,
button[type="submit"].pull-right,
button[type="button"].pull-right {
  float: right;
}


.checkbox {
  /*background: orange;*/
  padding-left: 5px;
  padding-bottom: 10px;
  font-weight: normal;
}
.checkbox input[type="checkbox"] {

}


@media (max-width: 998px) {

}

/* basic form controls */
.form-row label {
  float: left; width: 150px;
  line-height: 40px;
  text-align: right;
  padding-right: 8px;
}
.form-row label.wider {
  width: 200px;
}
.form-row .value {
 float: left; max-width: 350px; width: 100%;
}
.formsubmit .submit {
  float: left;
  margin-left: 150px;
  max-width: 200px;
}
/* END basic form controls */

.alert {
  padding: 15px;
  margin-bottom: 1rem;
  border: 1px solid transparent;
  border-radius: .25rem;
}
.alert-danger {
  color: #a94442;
  background-color: #f2dede;
  border-color: #ebcccc;
}
.alert-success {
  color: #3c763d;
  background-color: #dff0d8;
  border-color: #d0e9c6;
}







.top10link.suggestion {
  margin-bottom: 34px;
}
.top10link .add-suggestion {
  width: 90%;
  background:#80B584;
  margin-left: 5%;
  margin-top: 2px;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  font-size: 12px;
  color: #eee;
}
.top10link .add-suggestion:hover {
  cursor: pointer;
  background:green;
}
/*
.top10link .add-suggestion-search {
    width: 90%;
    background: #80B584;
    margin-left: 5%;
    margin-top: 2px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    font-size: 12px;
    color: #eee;
}

*/










#ajax_spinner {
  display: none;
  width: 34px;
  height: 34px;
  position: fixed;
  top: 50%;
  left: 50%;
  margin-left: -17px;
  margin-top: -17px;
  z-index: 200000;
}
#login_modal_wrapper {
  display: none;
  background: #eee;
  background: rgba(0,0,0,0.7);
  width: 100%; height: 100%;
  position: fixed; top: 0; left: 0;
  z-index: 10000;
}
#login_modal_wrapper.over {
  z-index: 10003;
}
#login_modal {
  display: none;
  z-index: 10002;
  background: #eee;

  border: 2px solid rgba(9,40,52,0.6);
  border-radius: 20px;

  position: fixed;
  top: 50%;
  left: 50%;

    padding: 10px 15px;
    width: 360px;
    height: 480px;
    margin-left: -180px;
    margin-top: -240px;
text-align:center;

}
.social-buttons-small {
  display: block;
}
#login-left .social-buttons img {
  padding: 5px;
}
  .social-buttons-small img {
    margin-left: 10px;
  }
@media (max-width: 768px) {
  #login-right h4 {
    text-align: center
  }


  #login-left {
    display: none;
  }

  #login_modal {
    padding: 10px 15px;
    width: 360px;
    height: 480px;
    margin-left: -180px;
    margin-top: -240px;
  }
  #login-right {
    width: 100%;
  }
}
@media (max-width: 370px) {

  #login_modal {
    padding: 10px 15px;
    width: 270px;
    height: 480px;
    margin-left: -135px;
    margin-top: -240px;
  }
}

#lostPassModal {
  padding: 8px;
}

@media (max-width: 570px) {
  .form-row label {
    text-align: left;
  }
}


/* for media stats modal on category pages */
#info_media_modal {
  display: none;
  width: 200px;
  height: 130px;
  position: fixed;
  top: 50%;
  left: 50%;
  margin-top: -65px;
  margin-left: -100px;
  background: #eee;
  z-index: 100000;
}
#info_media_modal table {
  width: 100%;
}
#info_media_modal table td {
  padding: 8px;
}
#info_media_modal table td.counter {
  color: #e6ab8f;
  font-size: 1.4em;
}
#info_media_modal table td.key {
  color: #afbfd7;
}

/* END media stats modal on category pages */


#search-box-header {
  position: absolute;
  right: 0;
  top: 0;
}
#searchBarTop input {
  padding: 2px;
  width: 150px;
}
#topSearchIconMobile {
  display: none;
}


@media (max-width: 959px) {
  #search-box-header {
    top: 15px;
  }
}

@media (max-width: 760px) {
  #search-box-header {
    display: none;
  }
}

@media (max-width: 760px) {
#topSearchIconMobile {
    display: block;
    float: right;
    margin: 28px 20px 0px 0;
    background-color: #307DA8;
    padding: 10px 9px;
}
  #topSearchIconMobile:hover {
    cursor: pointer;
  }
}


#topUserIconMobile {
    display: block;
    float: right;
    margin: -67px 100px -30px 0;
    background-color: #f53300;
    padding: 10px 9px;
}
  #topUSerIconMobile:hover {
    cursor: pointer;
  }
}


/* END search bar top right on allpages */


/* for following topics */

/* for the wider categories (grid_12) */
.subtopics .inner {
  margin-left:20px;height:50px;
  position:relative;
  /*background:green;*/
}

/* for the narrower categories (grid_4) */
.subtopics.grid_4 .inner {
  margin-left:20px;height:50px;
  position:relative;
  /*background:green;*/
}



.subtopics {
    margin: 5px 10px 10px 0;
    background: #fff;
    padding: 0px;
    border: 1px #eee solid;
    box-shadow: azure;
    border-radius: 6px;
    box-shadow: 2px 2px 2px rgba(0, 0, 0, .1);

}
.top-buttons {
    float: left;
}

#bookmark-counter:hover,#topic-counter:hover {
	cursor: pointer;
}
#bookmark-counter, #topic-counter {
    float: left;
    background-color: #307DA8;
    padding: 0 5px;
    min-width: 25px;
    color: white;
    text-align: center;

    margin: 0 10px;
    display: block;
    transition: background-color 0.5s ease;


}
#bookmark-counter.highlight, #topic-counter.highlight {
	background-color: #f53300 ;
}





#top-bar-counters {
    display: none;
    /* position: absolute; */
    /* right: 210px; */
    /* top: 1px; */
    min-width: 230px;
    height: 36px;
    margin-right: 20px;
    background: #345873;
    border: 1px solid rgba(255, 255, 255, 0.12);
    padding: 6px 15px 5px 0px;
}


@media (max-width: 760px) {
	#top-bar-counters {
		display:none !important;
	}
}

#bookmark-wrap,#topic-wrap {
    color: white;

    float: left;

}







#login_hp{
    display: block;
    z-index: 10002;
    background: rgba(238, 238, 238, 0.8);
    border: 1px solid rgba(249, 249, 249, 0.28);

    width: 300px;

    margin: 28px;
    float: right;

    box-shadow: 2px 2px 2px rgba(0, 0, 0, .1);
}





.hp_wall_banner {
    width: 100%;
    background: rgb(0, 0, 0);
    border-bottom: 1px solid rgba(48, 125, 168, 0.8);
    margin-top: -10px;
    background-image: url(/images/hp-bg2.jpg);
    background-repeat: no-repeat;
    background-position: center;
display:none;

}



.shownow{
display:block}
#hp-text{
color: #fff; max-width: 400px; font-size: 3em; line-height: 1.6em; text-shadow: 2px 2px 2px rgba(0, 0, 0, .5); margin: 1.4em 0 .1em 1em;
}



@media screen and (max-width:760px) {

.bx-wrapper{display:none}

#hp-text {

    max-width: 300px;
    font-size: 2.3em;
    line-height: 1.3em;

}

}










#wall_banner_inner {
  background-repeat: none;
  background-position: center;
  background-size: contain;
  max-width: 960px;

  margin: 0 auto;

}

#hp-button{
background: #f53300; padding: 10px 20px; margin-top: 20px; margin-bottom: 40px; margin-left:50px; color: #fff; display: inline-block; border-radius: 4px;
}
.green{color: #3eb373;}
.blue{color: #307DA8;}

.subtopics.grid_4 .follow-cat {
 background-size: contain;
}

.follow-cat:hover {
  cursor: pointer;
}
h1 {
  position: relative;
}
h1 div.follow-cat {

    float: right;
    margin-left: 10px;
    padding: 5px;

}



ul#header_nav {float:right;   position: relative;    min-width: 280px;}
ul.drop a { display:block; color: #fff; font-family: Verdana; font-size: 14px; text-decoration: none;}
ul.drop, ul.drop li, ul.drop ul { list-style: none; margin: 0; padding: 0; color: #fff;}
ul.drop { position: relative; z-index: 597; float: left; }
ul.drop li { float: left;  vertical-align: middle; zoom: 1;  }
ul.drop li.hover, ul.drop li:hover { position: relative; z-index: 599; cursor: default; }
ul.drop ul { visibility: hidden; position: absolute; top: 100%; left: 0; z-index: 598; width: 195px; background: #555; border: 1px solid #fff; }
ul.drop ul li { float: none; }
ul.drop ul ul { top: -2px; left: 100%; }
ul.drop li:hover > ul { visibility: visible }





ol, ul {
	list-style: none;
}
.main_menu {
    position: relative;
    float: right;
    margin-top:28px;
    margin-left:7px;
padding:0;
}

.main_menu li {
  float: left;

}

.main-menu-button {
    background: #345873;
    border: none;
    margin: 0 7px;
    font-size: 20px;
    width: 35px;
    height: 35px;
    padding: 0;
}


.main_menu .submenu {
    position: absolute;
    display: none;
    background-color: #ffffff;
    display: none;
    right: 9px;
z-index: 1000000;
    padding: 15px;
    background-color: #345873;
}

.submenu select{
cursor:pointer;
}

.submenu option{
padding:7px;
}


.submenu option:hover{
    background-color: rgb(245, 51, 0);
    color: #fff;
}


.main_menu li:hover .submenu {
    display: block;
    width: 231px;
    right: 7px;
}

#mobile_buttons {display: inline-block; float:right}
@media only screen and (min-width: 960px){
#mobile_buttons {display: none;}
}
#buttons {display: none;}


@media only screen and (min-width: 960px){
#buttons {display: block;}
}

/**
 * Tooltip Styles
 */

/* Add this attribute to the element that needs a tooltip */
[data-tooltip] {
  position: relative;
  z-index: 2;
  cursor: pointer;
}

/* Hide the tooltip content by default */
[data-tooltip]:before,
[data-tooltip]:after {
  visibility: hidden;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  pointer-events: none;
}

/* Position tooltip above the element */
[data-tooltip]:before {
  position: absolute;
  bottom: 100%;
  left: 50%;
  margin-bottom: 5px;
  margin-left: -60px;
  padding: 7px;
  width: 120px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  background-color: #000;
  background-color: rgba(58, 150, 218, 0.84);
  font-family:'Oswald', Arial, Helvetica, sans-serif;
  color: #fff;
  content: attr(data-tooltip);
  text-align: center;
  font-size: 14px;
  line-height: 1.2;
}

/* Triangle hack to make tooltip look like a speech bubble */
[data-tooltip]:after {
  position: absolute;
  bottom: 100%;
  left: 50%;
  margin-left: -5px;
  width: 0;
  border-top: 5px solid #000;
  border-top: 5px solid rgba(58, 150, 218, 0.84);
  border-right: 5px solid transparent;
  border-left: 5px solid transparent;
  content: " ";
  font-size: 0;
  line-height: 0;
}

/* Show tooltip content on hover */
[data-tooltip]:hover:before,
[data-tooltip]:hover:after {
  visibility: visible;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}


.button-reset{
    border: 0;
    background-color: transparent;
    float: right;
    margin: 0;
    padding: 0;
}

/* END for following topics */