body{font:100% Verdana,Arial,Helvetica,sans-serif;margin:0;padding:0;text-align:center;color:#000;background-color:#CCC}

/* Definicion del Lay Out y clases de Site.Master */
.oneColFixCtrHdr #container{width:100%;text-align:left;margin:0px;background-color:#CCC; }
.oneColFixCtrHdr #header{padding:0px}
.oneColFixCtrHdr #header #logocliente{margin:0;height:38px;padding-top:0px;padding-right:15px;padding-bottom:0px;padding-left:15px;background-color:#58646E;background-repeat:repeat-x;background-position:left top}
.oneColFixCtrHdr #header #menu{margin:0;background-image:url(images/menu.png);background-repeat:repeat;background-position:left top;padding-top:1px;padding-bottom:0px;padding-right:5px;padding-left:5px; height:30px; color:white;font-family:Arial,Helvetica,sans-serif;font-size:12px;line-height:28px;} 

.oneColFixCtrHdr #mainContent{padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;background-color:#ccc;}
.oneColFixCtrHdr #mainContent #pantallas{padding:5px;width:auto;text-align:center; overflow:hidden}    

.oneColFixCtrHdr #footer
{
    background-color:#58646E;
    background-repeat:repeat;
    border-top-width:1px;
    border-top-style:solid;
    border-top-color:#999;
    height:36px;
    width:100%;
    padding-top:0;
    padding-right:0px;
    padding-bottom:0;
    padding-left:0px;
    font-family:Helvetica,Arial,Verdana,sans-serif;
    font-size:11px;text-align:right;
    position:relative;
    bottom:0;
}

#logopantalla{float:left;padding:5px;position:static}
#titulopantalla{float:left;padding-top:10px;padding-right:0px;padding-bottom:0px;padding-left:5px;font-family:Helvetica,Arial,Verdana,sans-serif;font-size:13px;color:#333;text-decoration:none;font-weight:bold;position:static}
#accionespantalla{float:right;padding-top:5px;padding-right:0px;padding-bottom:5px;text-align:right;position:fixed;right:10px;overflow:visible;padding-left:5px;left:333px}
#subtitulopantalla{float:left;padding-top:10px;padding-right:0px;padding-bottom:0px;padding-left:0px;font-family:Helvetica,Arial,Verdana,sans-serif;font-size:13px;color:#333;text-decoration:none;font-weight:normal;overflow:visible;position:relative}
.TextoTituloWindow{font-family:Arial,Helvetica,sans-serif;font-size:11px;font-weight:bold;color:#FFF;text-decoration:none;margin-right:5px;margin-left:5px}
.Estilo2{color:white;font-family:Arial,Helvetica,sans-serif;font-size:9px;font-style:normal;line-height:8px;padding-bottom:5px;padding-left:15px;padding-right:15px;padding-top:5px;text-align:center}
.Estilo1{font-size:9px;color:white;font-style:normal;line-height:8px;text-decoration:underline;font-family:Verdana,Arial,Helvetica,sans-serif}


/* MENU /////////////////////////////////////////////////////////*/
/* botones dinamicos de acceso restringido por usuario */

#header #menu .item  
{
	border: solid 1px #3D556C;
	padding:5px 5px 5px 5px;
}

.item .text{ padding:3px 3px 3px 3px;}

#header #menu .hover .item .text
{			
	color: #000000;		
	background-image: url(images/MenuItemSeleccionado.png);
	background-repeat:repeat-x;		
	background-position: center left;
	padding:2px 2px 2px 2px;
	border: solid 1px #3D556C;
}

.IE8Fix 
{
	z-index: 100;
}

#header #menu .sitem  
{	
	padding: 5px 5px 5px 5px;
}

#header #menu .sitem .stext{ padding:4px 30px 4px 4px;}

#header #menu .hover .sitem .stext
{			
	color: #000000;		
	background-image: url(images/MenuItemSeleccionado.png);
	background-repeat:repeat-x;		
	background-position: center left;
	padding:3px 29px 3px 3px;
	border: solid 1px #3D556C;
}

#header #menu .selected { font-weight:bold; }

#header #menu .mimage { vertical-align: middle; padding-right: 5px; } 

#header #menu .submenu { color: #000000; background-color: #F0F2F4; padding: 0px 0px 0px 0px; border: solid 1px #3D556C;}
#header #menu img { border: none 0px transparent;}
#header #menu a { color: #FFFFFF; }
#header #menu .submenu a { color: #000000; }

/* MENU /////////////////////////////////////////////////////////*/

/*Fila azul de arriba, en donde van los titulos de los items  (en Grids)*/
.TD_DestacadoArriba {
	border-bottom-color: #9BA6C1;
	border-bottom-style:solid;
	border-bottom-width:1px;
	border-top-color: #9BA6C1;
	border-top-style:solid;
	border-top-width:1px;
	background-color: #B3BBD0;
	border-right-color: #9BA6C1;
	border-right-style:solid;
	border-right-width:1px;
	background-color: #B3BBD0;
	text-align:left;
	height: 25px;
	padding-bottom:3px;
    padding-top:3px;
    padding-left:10px;
    padding-right:10px;
    text-align: left;
    font-weight:bold;
    font-size: 11px;
    color:#333333;
    font-family: Tahoma,Arial,Helvetica,Verdana;
}

.TD_DestacadoArriba a:link
{
	color:#3A5163;
} 
.TD_DestacadoArriba a:hover
{
	 color: #FEFEFE;
}

.Row1 a:link
{
	color:#3A5163;
} 
.Row1 a:hover
{
	 color: #CCCCCC;
}
.Row1 a:visited
{
	color:#3A5163;
} 
.Row2 a:link
{
	color:#3A5163;
} 
.Row2 a:hover
{
	 color: #CCCCCC;
}
.Row2 a:visited
{
	color:#3A5163;
}


/*Fila de color blanco que alterna con las grises (en Grids)*/
.Row1 {
    background-color: #FFFFFF;
    height: 25px;
    padding-bottom:3px;
    padding-top:3px;
    padding-left:10px;
    padding-right:10px;
    text-align: left;
    font-family: Tahoma,Arial,Helvetica,Verdana;
    font-size:12px;
    }
/*Fila de color gris que alterna con las blancas (en Grids)*/
.Row2 {
    background-color: #DFDFDF;
    height: 25px;
    padding-bottom:3px;
    padding-top:3px;
    padding-left:10px;
    padding-right:10px;
    text-align: left;
    font-family: Tahoma,Arial,Helvetica,Verdana;
    font-size:12px;
    }
/*Fila de roja en caso de error */
.RowError {
    background-color:#ffeeee; 
    border-width:1px; 
    border-style:solid; 
    border-color:#FF0000;	
    margin: 0px 0px 0px 0px;
	padding-bottom:3px;
    padding-top:3px;
    padding-left:10px;
    padding-right:10px;
    text-align: left;
    color:Red;
    font-weight:bold;
    font-size: 11px;
    
    font-family: Tahoma,Arial,Helvetica,Verdana;
    }    
/*Fila azul de abajo, en donde van los pies de pagina*/
.TD_DestacadoAbajo {
	border-bottom-color: #9BA6C1;
	border-bottom-style:solid;
	border-bottom-width:1px;
	border-top-color: #9BA6C1;
	border-top-style:solid;
	border-top-width:1px;
	background-color: #B3BBD0;
	border-right-color: #9BA6C1;
	border-right-style:solid;
	border-right-width:1px;
	background-color: #B3BBD0;
	height: 25px;
	padding-bottom:3px;
    padding-top:3px;
    padding-left:10px;
    padding-right:10px;
    text-align: left;
	}

.TD_DestacadoAbajo table 
{
	width:200px;
	float:right;
}

/*Columna azul, en donde van los titulos de los items */
.Columna1 {
	background-color: #B3BBD0;
	border-top-color: #9BA6C1;
	border-top-style:solid;
	border-top-width:1px;
	border-right-color: #9BA6C1;
	border-right-style:solid;
	border-right-width:1px;
	text-align:left;
	width:85px;	
	padding-bottom:5px;
    padding-top:5px;
    padding-left:10px;
    padding-right:10px;
    text-align: left;
	}
/*Columna gris, en donde van los items */
.Columna2 {
	background-color: #DFDFDF;
	border-top-color: #9BA6C1;
	border-top-style:solid;
	border-top-width:1px;
	border-right-color: #9BA6C1;
	border-right-style:solid;
	border-right-width:1px;
	text-align:left;	
	padding-bottom:5px;
    padding-top:5px;
    padding-left:10px;
    padding-right:10px;
    text-align: left;
	}
	
	
/* -------- Esquinas que enmarcan la tablas contenedoras de la vistas ------------ */
/* Esquina superior izquierda */
.WindowMarco1 { 
	background-image: url(images/WindowMarco1.png);
	background-repeat:  repeat-x;
	background-position: right top;
	height: 30px;
	width: 7px;
}
/* Superior central*/
.WindowMarco2 {
	background-image: url(images/WindowMarco2.png);
	background-repeat:  repeat-x;
	background-position: left top;
	height: 30px;
	margin-top: 15px;
	margin-right: 5px;
	margin-bottom: 5px;
	margin-left: 5px;
}
/* Esquina superior derecha */
.WindowMarco3 {
	background-image: url(images/WindowMarco3.png);
	background-repeat:  repeat-x;
	background-position: left top;
	height: 30px;
	width: 7px;
}
/* Medio izquierda*/
.WindowMarco4 {
	background-image: url(images/WindowMarco4.png);
	background-repeat:   repeat-y;
	background-position: right top;
	height: 30px;
	width: 7px;
}
/* Medio centro*/
.WindowMarco5 {
	background-color: #DFDFDF;
}
/* Medio derecha*/
.WindowMarco6 {
	background-image: url(images/WindowMarco6.png);
	background-repeat:   repeat-y;
	background-position: left top;
	height: 30px;
	width: 7px;
}
/* Esquina inferior izquierda */
.WindowMarco7 {
	background-image: url(images/WindowMarco7.png);
	background-repeat:  repeat-x;
	background-position: right top;
	height: 6px;
	width: 7px;
}
/* Esquina inferior centro */
.WindowMarco8 {
	background-image: url(images/WindowMarco8.png);
	background-repeat:  repeat-x;
	background-position: right top;
	height: 6px;
}
/* Esquina inferior derecha */
.WindowMarco9 {
	background-image: url(images/WindowMarco9.png);
	background-repeat:  repeat-x;
	background-position: left top;
	height: 6px;
	width: 7px;
}
/* borde para algunos controles */
.BORDER {
	border: 1px solid #cccccc;    
}
/* para ajustar los DropDownListCSS */
.DropDownListCSS {
    border-style: none;
    border-width: 0px;
    border-color: #ffffff;
    width:100%;
    height:100;
    text-align: left;
}

.Boton {
	background-image: url(images/fondoBoton.png);
	background-repeat:  repeat-x;
	background-position: left top;
	text-align: center;
}

/* Para los wizards */
.FondoClaro {
	background-color: #cccccc;
	text-align:left;	
	padding-bottom:20px;
    padding-top:20px;
    padding-left:20px;
    padding-right:20px;
    vertical-align:top;
}
.FondoOscuroPagInicio
{
    background-color:#DAE2E8;
    padding:5px
 }
/* Para los wizards */
.FondoOscuro {
	background-color: #666666;
	text-align:left;
	width:180px;
	padding-bottom:5px;
    padding-top:5px;
    padding-left:10px;
    padding-right:10px;
    color:#FDFDFD;
    font-size:11px;
    font-weight:bold;
    vertical-align:top;
}

.FondoOscuro td
{
	padding-top: 10px;
}	
.FondoOscuro a:link
{
	color:#FDFDFD;
} 
.FondoOscuro a:hover
{
	 color: #CCCCCC;
}
.FondoOscuro a:visited
{
	color:#FDFDFD;
} 
	
/* Para los labels en los wizards 
.TituloOscuro {
	background-color: #666666;
	text-align:left;
	width:200px;
	padding-bottom:20px;
    padding-top:20px;
    padding-left:10px;
    padding-right:10px;
    text-align: left;
	}*/	
	
/* wizards */	
.panelMsj
{
    border: 1px solid #CFD7DA;
    height: 100%;
   background-color: #FFFFCC;
    font-weight: bold;
    color: #DD0000;
    font-size: 11px;
}

h3
{
    margin-top:3px;
    font-family: Tahoma, Arial, Helvetica, Verdana;
    font-size: 14px;
    font-weight: normal;
    font-style: normal;
    font-variant: normal;
    color: Black;
}
 .wizard
{
	border: 1px solid #CFD7DA;
	font: 11px Verdana,Sans-Serif;
	width: 650px;
	height: 346px;
}
.header
{
    color:gray;
    font:bold 11px Verdana,Sans-Serif;
}
.sideBar
{
   /* background-color: #B7CAD1;
    padding: 10px;
    width: 170px;
    color: #AEB7D9;*/
	background-color: #666666;
	text-align:left;
	width:200px;
	padding-bottom:5px;
    padding-top:5px;
    padding-left:10px;
    padding-right:10px;
    text-align: left;
}
.titleStep
{
    font-family: Tahoma, Arial, Helvetica, Verdana;
    color:#cccccc;
    font-size: 14px;
}
.textLabels
{
     color: #FF0000;
    font: "Trebuchet MS" , Verdana, Arial, Helvetica, sans-serif;
}
.sideBar a
{
    text-decoration:none;
}
.step
{
    padding:10px;
    text-align:left;
    margin-top:0px;
    vertical-align:top;
}
.ButonNext
{
    border: 1px solid #808080;
    color: #284775;
    font: "Trebuchet MS" , Verdana, Arial, Helvetica, sans-serif;
    margin: 0;
    padding: 0;
    width: 70px;
    border-collapse: collapse;
    display: inline;
}
.Navigation
{
    background-color: #CAD8DD;
}

.CamposFiltros
{
    padding:10px;
    text-align: left;
    vertical-align: top;
    font-family: Tahoma, Arial, Helvetica, Verdana;
}
.Wizard_filtrosView
{
    text-align:right;
    float:right;
     height: 10px;
     width: 283px;
    vertical-align:top;
}
/*.ControlsStyle
{
 font-family:Verdana,Arial, Helvatica, Sans-Serif;
 font-size:11px;
 line-height:normal;
 font-weight:normal;
 color:#000000;
}*/
.BotonWizard {
  border: 1px solid #333333;
  font-weight:bold;
  text-decoration:none;
  font-family:Tahoma,Arial,Helvetica,Verdana;
  font-size:12px;
  color: #FFFFFF;
  background-image: url(images/fondoBoton.png);
  background-repeat:  repeat-x;
  background-position: left top;
  text-align: center;
    }
.ItemWizard {
  Height:20px;
  line-height:20px;
  font-family:Tahoma,Arial,Helvetica,Verdana;
  font-size:11px;
  color: #FFFFFF;
    }
.Padding 
{
  vertical-align:top;
  padding-bottom:33px;
    }
/*    
table 
{
	padding: 0 0 0 0;
	margin: 0 0 0 0;
	width:100%;	
}
*/

.LinkVentana
{
	display: flex;
	align-items: center;
}

.LinkVentana div
{	
	padding-top:2px;				
}

.TituloVentanaSobreGrilla
{
	font-weight:bold;
	text-decoration:none;
	font-family:Tahoma,Arial,Helvetica,Verdana;
	font-size:12px;
	color: #333333;
}

.DescripcionVentanaSobreGrilla
{
}

.ItemStyle
{
	padding: 0px 5px 0px 5px;
}

.txtTituloItems{font-family:Arial,Helvetica,sans-serif;font-size:11px;color:#000;text-decoration:none;padding-top:5px;padding-right:10px;padding-bottom:5px;padding-left:10px}

.TextoTituloMenuInicioTrial{font-family:Arial,Helvetica,sans-serif;font-size:11px;font-weight:bold;color:#fff;padding-left:10px}
.TextoTituloItem{font-family:Arial,Helvetica,sans-serif;font-size:13px;color:#42484D;text-decoration:none;font-weight:bold;padding-top:12px}
.TextoSubTituloItem{font-family:Arial,Helvetica,sans-serif;font-size:12px;color:#42484D;text-decoration:none;padding-top:3px;padding-bottom:3px;padding-right:0px;padding-left:0px}
.TextoStatusOk{font-family:Arial,Helvetica,sans-serif;font-size:10px;color:#7CBB1F;font-weight:bold;padding-right:10px;padding-left:5px}
.TextoStatusNo{font-family:Arial,Helvetica,sans-serif;font-size:10px;color:#E3312A;font-weight:bold;padding-right:10px;padding-left:5px}
.TextoStatus{font-family:Arial,Helvetica,sans-serif;font-size:10px;color:#999;font-weight:bold;padding-right:10px}

.filtro{background-color:#F4F4F4;color:#000;font-family:Verdana,Arial,Helvetica,sans-serif;text-align:left}
.filtro input {font-size:11px;color:#000;text-decoration:none;text-align:left;vertical-align:middle;height:19px;padding:1px;margin:0px}
.filtroTituloSeccion{font-size:12px;background-color:#8EA3B9;font-family:Verdana,Arial,Helvetica,sans-serifpadding-top:20px;font-weight:bold;padding:4px;color:#fff;border:1px solid #8EA3B9}
.filtroDescripcionSeccion{background-color:#f2f2f2;border:1px solid #8EA3B9;color:#333;font-size:10px;padding:3px}
.filtroTituloCampo{font-size:11px;font-weight:bold;padding-bottom:5px;padding-top:10px;color:#111}
.filtroContenidoCampo{font-size:12px;padding-bottom:15px}
.filtroContenidoCampo .From{font-family:Verdana,Arial,Helvetica,sans-serif;font-size:11px;color:#768CA5;text-decoration:none;padding-right:5px;padding-left:5px}
.filtroContenidoCampo .To{font-family:Verdana,Arial,Helvetica,sans-serif;font-size:11px;color:#768CA5;text-decoration:none;padding-left:20px;padding-right:5px}
.filtroContenidoCampo .Lista{font-family:Verdana,Arial,Helvetica,sans-serif;font-size:11px;color:#5F7792;text-decoration:none;padding-right:5px;padding-left:5px;width:280px}
.filtroTituloHistorial{font-size:11px;background-color:#8EA3B9;font-family:Verdana,Arial,Helvetica,sans-serifpadding-top:20px;font-weight:bold;padding:4px;color:#fff;border:1px solid #8EA3B9}
.filtroHistorialLogDiv{background-color:#DAE2E8;border:solid 1px #333;font-size:10px;padding-left:10px;padding-top:5px;padding-bottom:5px}
.filtroHistorialLogDiv ul{}.filtroHistorialLogDiv li{margin-top:0;margin-bottom:0;margin-left:20px;padding-left:15px;list-style-type:circle}
.filtroHistorialLogDiv label{}.filtroHistorialLog{font-size:10px}
.filtroContenidoCampo input {height:19px}
.filtroBotonera{border-top:1px solid #333;background-color:#999;padding:5px}

.textarea600 { width: 100%; }
@media only screen and (min-width: 700px)
{
	.textarea600 { width: 600px; }
}

#sidebar {
    float:right;
    position: relative;
    top: 90px;
    
}

#sidebar-content {
    width: 20%;
    min-width:170px;
    float: left;
    background-color: white;
}

#toggleSidebar {
    float: left;
    height: 100%;
}

.arrow-left 
{
      background-image: url(images/flecha_IR_Principio.png);
      width: 30px;
    height: 30px;
    background-repeat: no-repeat;
    background-size: 30px 30px;
}
.arrow-right
{
      background-image: url(images/flecha_IR_Final.png);
      width: 30px;
    height: 30px;
    background-repeat: no-repeat;
    background-size: 30px 30px;
}

.SocialMedia 
{
    width:30px;
    height:30px;
    padding-right:10px;
}    
.SocialMedia:hover {
    z-index: 2;
    -webkit-transform: translateY(-5px);
    transform: translateY(-5px);
}
/* Pantalla Login*/

         .bodyLogin
        {
            padding: 0;
            margin: 0;
            background: url(/App_Themes/images/homeimage.jpg) no-repeat bottom;
            background-size: cover;
            -webkit-background-size: cover;
            -o-background-size: cover;
            -ms-background-size: cover;
            -moz-background-size: cover;
            font-family: 'Josefin Slab' , serif;
        }
        .bodyLogin h1, h2, h3, h4, h5, h6
        {
            font-family: 'Carter One' , cursive;
            margin: 0;
        }
        .bodyLogin p
        {
            margin: 0;
        }
        .bodyLogin ul
        {
            margin: 0;
            padding: 0;
        }
        .bodyLogin label
        {
            margin: 0;
        }
        /*-- main --*/.content h1
        {
            text-align: center;
            font-size: 40px;
            color: #fff;
        }
        .main
        {
            margin: 70px auto;
            width: 70%;
        }
        .profile-left
        {
            float: left;
            width: 40%;
        }
        .profile-middle
        {
            float: left;
            width: 40%;
            
        }
        .profile-left input[type="text"], .profile-left input[type="password"]
        {
            outline: none;
            border: 2px solid #648d9f;
            padding: 10px 10px 10px 45px;
            color: #D8D8D8;
            font-family: 'Josefin Slab' , serif;
            font-size: 18px;
            width: 76%;
            margin-bottom: 30px;
            border-radius: 4px;
            -webkit-border-radius: 4px;
            -o-border-radius: 4px;
            -ms-border-radius: 4px;
            -moz-border-radius: 4px;
        }
        .login
        {
            background: #fbfbfb;
            padding: 40px 30px;
            margin-bottom: 3%;
        }
        .profile-left h2
        {
            background: #f99104;
            padding: 14px 0;
            font-size: 25px;
            color: #fff;
            text-align: center;
            font-family: 'Josefin Slab' , serif;
        }
        .profile-left input[type="text"]
        {
            background: url(/App_Themes/HSTheme/images/user.png) no-repeat 13px 10px;
        }
        .profile-left input[type="password"]
        {
            background: url(/App_Themes/HSTheme/images/key.png) no-repeat 13px 10px;
        }
        /*-- responsive media queries --*/@media (max-width: 1680px)
        {
            .bodyLogin
            {
                min-height: 65.8em;
            }
            .content
            {
                padding: 9em 0;
            }
            .main
            {
                margin: 100px auto;
            }
        }
        @media (max-width:1600px)
        {
            .content
            {
                padding: 4em0;
            }
            .main
            {
                margin: 60px auto;
            }
            .bodyLogin
            {
                min-height: 50em;
            }
        }
        @media (max-width:1440px)
        {
            .bodyLogin
            {
                min-height: 56.5em;
            }
            .content
            {
                padding: 7em 0;
            }

        }
        @media (max-width: 1366px)
        {
            .bodyLogin
            {
                min-height: 48.2em;
            }
            .content
            {
                padding: 3em 0;
            }
        }
        @media (max-width:1280px)
        {
            .profile-leftinput[type="text"]
            {
                background: url(/App_Themes/HSTheme/images/user.png)no-repeat13px9px;
            }
            .profile-left input[type="password"]
            {
                background: url(/App_Themes/HSTheme/images/key.png) no-repeat 13px 9px;
            }
            .bodyLogin
            {
                min-height: 50.2em;
            }
            .content
            {
                padding: 5em 0;
            }

        }
        @media (max-width: 1080 px)
        {
            .login
            {
                padding: 36px30px;
            }

            .profile-img h3
            {
                font-size: 32px;
            }
        }
        @media (max-width: 1024 px)
        {
            .main
            {
                width: 65%;
            }

        }
        @media (max-width:991px)
        {
        }
        @media (max-width:800px)
        {
            .main
            {
                width: 83%;
            }
            .bodyLogin
            {
                min-height: 58.2em;
            }
            .content
            {
                padding: 9em 0;
            }
            .content h1
            {
                font-size: 33px;
            }
            .profile-right
            {
                float: none;
                width: 26%;
                margin: 0 auto;
            }
            .profile-left input[type="text"], .profile-left input[type="password"]
            {
                width: 73%;
            }
        }
        @media (max-width: 768px)
        {
            .profile-right
            {
                float: none;
                width: 65%;
            }
            .mb_share .button
            {
                margin: 0 auto 13.7px;
            }
        }
        @media (max-width: 736px)
        {
            .content
            {
                padding: 5em 0;
            }
            .bodyLogin
            {
                min-height: 49.2em;
            }

        }
        @media (max-width: 667px)
        {
            .login
            {
                padding: 20px 20px;
            }
            .profile-left input[type="text"], .profile-left input[type="password"]
            {
                width: 71%;
                background-size: 8% !important;
            }
            .profile-left input[type="password"]
            {
                background: url(/App_Themes/HSTheme/images/key.png) no-repeat 13px 11px;
            }
            .profile-img h3
            {
                font-size: 28px;
            }


            .profile-right
            {
                width: 80%;
            }
        }
        @media (max-width: 640px)
        {
            .main
            {
                width: 86%;
            }
            .bodyLogin
            {
                min-height: 47.2em;
            }
        }
        @media (max-width: 600px)
        {
            .profile-middle
            {
                margin: 0 0 0 4%;
            }
            .profile-left
            {
                width: 47%;
            }
            .profile-left input[type="text"], .profile-left input[type="password"]
            {
                padding: 8px 10px 7px 35px;
            }
        }
        @media (max-width: 568px)
        {
            .profile-left input[type="text"], .profile-left input[type="password"]
            {
                width: 73%;
            }


        }
        @media (max-width: 480px)
        {
            .main
            {
                width: 65%;
            }
            .profile-left
            {
                width: 100%;
            }
            .profile-middle
            {
                margin: 0;
                width: 100%;
            }
            .profile-right
            {
                width: 90%;
            }
            .profile-left input[type="text"], .profile-left input[type="password"]
            {
                width: 81%;
            }
            .profile-left input[type="password"]
            {
                background: url(/App_Themes/HSTheme/images/key.png) no-repeat 13px 9px;
            }
            .profile-left input[type="text"], .profile-left input[type="password"]
            {
                background-size: 6% !important;
            }
            .content h1
            {
                font-size: 28px;
            }
            .main
            {
                margin: 45px auto;
            }
            .content
            {
                padding: 4em 0;
            }
        }
        @media (max-width: 414px)
        {
            .main
            {
                width: 75%;
            }
            .profile-left input[type="text"], .profile-left input[type="password"]
            {
                background-size: 5.5% !important;
            }
        }
        @media (max-width: 384px)
        {
            .content h1
            {
                font-size: 25px;
            }
        }
        @media (max-width:375px)
        {
            .main
            {
                width: 82%;
            }
            .login-left ul li a.goog i
            {
                background: url(/App_Themes/HSTheme/images/twitt.png) no-repeat 0px 5px;
                width: 29px;
            }
            .login-left ul li a.fb i
            {
                background: url(/App_Themes/HSTheme/images/fb.png) no-repeat 16px 3px;
                width: 45px;
            }
        }
        @media (max-width:320px)
        {
            .content h1
            {
                font-size: 22px;
            }
            .content
            {
                padding: 3em 0;
            }
            .profile-right
            {
                width: 100%;
            }
            .profile-left h2
            {
                padding: 10px 0;
            }
            .profile-left input[type="text"], .profile-left input[type="password"]
            {
                font-size: 16px;
            }
            .profile-left input[type="text"], .profile-left input[type="password"]
            {
                background-size: 6% !important;
            }
            .main
            {
                width: 87%;
            }
            .profile-left input[type="text"], .profile-left input[type="password"]
            {
                width: 77%;
            }

            .login-left ul li a
            {
                font-size: 19px;
            }
        }
        .floating-box
        {
            display: inline-block;
            width: 300px;
            height: 150px;
            margin-bottom: 10px;
            background: whitesmoke;
        }


        .box-adv
        {
            position: relative;
            width: 100%;
            height: 100%;
            overflow: hidden;
            float: left;
            margin-right: 20px;
            background-color: rgba(26,76,110,0.5);
        }
        .box-adv p, .box-adv h2
        {
            color: #fff;
            padding: 10px;
            position: relative;
            
        }
        .box-adv p
        {
            font-family: 'Lato';
            font-size: 12px;
            line-height: 18px;
            margin: 0;
        }
        .box-adv h2
        {
            
            font-size: 20px;
            line-height: 24px;
            margin: 0;
        }
        .effect img
        {
            position: absolute;
            margin: 0px 0;
            right: 0;
            top: 0;
            cursor: pointer;
            height: 100%;
            width: 100%;
            -webkit-transition: top .4s ease-in-out,right .4s ease-in-out;
            -moz-transition: top .4s ease-in-out,right .4s ease-in-out;
            -o-transition: top .4s ease-in-out,right .4s ease-in-out;
            transition: top .4s ease-in-out,right .4s ease-in-out;
        }
        .effect img.top:hover
        {
            top: -230px;
            padding-bottom: 200px;
            padding-left: 300px;
        }
        .profile-right
        {
            float: left;
            margin-left: 0003%;
        }
        .mb_share
        {
            overflow: hidden;
        }
        .mb_share .button .native_button div
        {
            font-size: 14px;
            color: #212121;
        }
        .mb_share .button
        {
            position: relative;
            float: none;
            margin: 0 0 13.7px;
            width: 254px;
            height: 46px;
            overflow: hidden;
            text-transform: capitalize;
            cursor: pointer;
        }
        .mb_share .button .icon
        {
            float: left;
            z-index: 200;
            position: relative;
            width: 50px;
            height: 46px;
            background-repeat: no-repeat;
            background-image: url(/App_Themes/HSTheme/images/socialmedia.png);
        }
        .mb_share .button .native_button
        {
            width: 204px;
            height: 46px;
            float: left;
            background: #fff !important; 
            display: table;
        }
        .mb_share .button .native_button > div
        {
            display: table-cell;
            vertical-align: middle;
            text-align: center;
        }
        .mb_share .button .slide
        {
            position: absolute;
            right: 0;
            top: 0;
            z-index: 100;
            float: left;
            width: 204px;
            height: 46px;
            transition: .2s transform linear;
            -webkit-transition: .2s -webkit-transform linear;
            -moz-transition: .2s -moz-transform linear;
        }
        .mb_share .button .slide span
        {
            color: #fff;
            display: block;
            cursor: pointer;
            width: 100%;
            margin: 14px 0;
            text-align: center;
            font-size: 1em;
            border-left: 1px solid rgba(255,255,255,0.35);
        }
        /*-- Transitions --*/.mb_share .button.slide_x:hover .slide
        {
            -webkit-transform: translateX(204px);
            -moz-transform: translateX(204px);
            transform: translateX(204px);
            -o-transform: translateX(204px);
            -ms-transform: translateX(204px);
        }
        .mb_share .button.slide_nx:hover .slide
        {
            -webkit-transform: translateX(-204px);
            -moz-transform: translateX(-204px);
            transform: translateX(-204px);
            -o-transform: translateX(-204px);
            -ms-transform: translateX(-204px);
        }
        .mb_share .button.slide_y:hover .slide
        {
            -webkit-transform: translateY(46px);
            -moz-transform: translateY(46px);
            transform: translateY(46px);
            -ms-transform: translateY(46px); 
            -o-transform: translateY(46px);
        }
        .mb_share .button.slide_ny:hover .slide
        {
            -webkit-transform: translateY(-46px);
            -moz-transform: translateY(-46px);
            transform: translateY(-46px);
            -ms-transform: translateY(-46px);
            -o-transform: translateY(-46px);
        }
        /*-- Colors --*//*-- facebook --*/.mb_share .button.facebook .icon
        {
            background-position: 15px -20px;
        }
        .mb_share .button.facebook > div
        {
            background-color: #3b5998;
        }
        /*-- twitter --*/.mb_share .button.twitter .icon
        {
            background-position: -22px -20px;
        }
        .mb_share .button.twitter > div
        {
            background-color: #55acee;
        }
        /*-- youtube --*/.mb_share .button.youtube .icon
        {
            background-position: -62px -20px;
        }
        .mb_share .button.youtube > div
        {
            background-color: #cd201f;
        }
        /*-- google-plus --*/.mb_share .button.gplus .icon
        {
            background-position: -102px -20px;
        }
        .mb_share .button.gplus > div
        {
            background-color: #dc4e41;
        }
        /*-- linkedin --*/.mb_share .button.linkedin .icon
        {
            background-position: -144px -20px;
        }
        .mb_share .button.linkedin > div
        {
            background-color: #0077b5;
        }
        .bodyLogin .btn
        {
            cursor: pointer;
            font-size: 18px;
            white-space: nowrap;
            width: 100%;
            padding: .8em 1.5em;
            font-family: Open Sans, Helvetica,Arial,sans-serif;
            line-height: 18px;
            display: inline-block;
            zoom: 1;
            color: #fff;
            text-align: center;
            position: relative;
            -webkit-transition: border .25s linear, color .25s linear, background-color .25s linear;
            transition: border .25s linear, color .25s linear, background-color .25s linear;
        }
        .bodyLogin .btn.btn-orange
        {
            background-color: #f59e00;
            border-color: #f59e00;
            -webkit-box-shadow: 0 3px 0 #b37401;
            box-shadow: 0 3px 0 #b37401;
            width: 200px;
            margin-bottom: 3%;
            padding: 10px 10px 10px;
        }
        .bodyLogin .btn.btn-orange:hover
        {
            background-color: #dd9003;
        }
        .bodyLogin .btn.btn-orange:active
        {
            top: 3px;
            outline: none;
            -webkit-box-shadow: none;
            box-shadow: none;
        }