/*************** TOP SECTION*********************/

.top1{
border-bottom: 0px solid #9E2872;
-webkit-box-shadow: 0px 1px 3px 0px rgba(112,111,112,0.87);
-moz-box-shadow: 0px 1px 3px 0px rgba(112,111,112,0.87);
box-shadow: 0px 1px 3px 0px rgba(112,111,112,0.87);

}

.top2{
border:0px solid red; 
border-bottom: 1px solid #1E1A19;
padding-top: 5px;
padding-bottom:5px;
background: #CAF2FF;

/* gradient generator from http://www.cssmatic.com/gradient-generator#' */
/*
background: rgba(255,255,255,1);4
background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 20%, rgba(184,228,243,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(20%, rgba(255,255,255,1)), color-stop(100%, rgba(184,228,243,1)));
background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 20%, rgba(184,228,243,1) 100%);
background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 20%, rgba(184,228,243,1) 100%);
background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 20%, rgba(184,228,243,1) 100%);
background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 20%, rgba(184,228,243,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#b8e4f3', GradientType=0 );
*/
}

.top3{
border:0px solid red; 
border-bottom: 4px solid #ec1b23;
background: #040303;
height:45px;				/* Henry: to fix issue with big gray gap, Icon Menu responsive*/
position:relative;			/* Henry: to fix issue with big gray gap, Icon Menu responsive*/

}

/* slider bg */
.top4{
border:0px solid red; 
border-bottom: 0px solid gray;
}



/********* inside  for top 1 *******************/
/* box generated from  http://the-echoplex.net/flexyboxes/ */

.flex-container {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-align-content: stretch;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    }


.nth-child(1) {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.nth-child(2) {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.nth-child(3) {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }
     
/********* inside  for top 1 - EOF *******************/



#logo a {
background: url(../../../../images/logo_bg.png) no-repeat;
width: 459px;
height: 156px;
text-indent: -1000px;
overflow: hidden;
display: block; 
margin: auto; 
margin-top: 10px;
margin-bottom: 10px;
}

#logo a:hover {
background-position: 0px -156px;
}





/************************ search box start ******************/
.search_form
{
}

.adv_search
{
}

.search_box
{
  width:100%;
}


/************************ search box end ******************/



/************************ Responsive Structure ****************/

/* for new/big desktop from 1200 px and bigger ....*/
@media (min-width: 1200px) and (max-width: 3000px) {
}

/* for medium/old desktop screen from 1024 to 1200px */
@media (min-width: 1024px) and (max-width: 1200px) {
}


/* for medium view such as ipad  from 768 to 1024 */
@media (min-width: 768px) and (max-width: 1024px) {
}


/* for small view such as iphone, samsung : less than 768 */
@media (min-width: 0px) and (max-width: 767px) {
.flex-container {
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    }

#logo a {
background: url(../../../../images/logo_bg_small.png) no-repeat;
width: 250px;
height: 85px;
text-indent: -1000px;
overflow: hidden;
display: block; 
margin: auto; 
margin-top: 10px;
margin-bottom: 10px;
}

#logo a:hover {
background-position: 0px -85px;
}



}



************************ Responsive Structure EOF ****************/