

/* -------------------------------------------- */
/*--------------- VARIABLE DEFINE --------------*/
/* -------------------------------------------- */
:root 
{
/* FONT*/
--WS-font-type:calibri,verdana
	
/* PER-HEADER COLORS */
--WS-preheader-col-background: #404040;
--WS-preheader-col-foreground: #eeeeee;
    
/* BODY COLORS */
--WS-col-background: white;

/* TEXT */
--WS-col-title-text: orangered;
--WS-col-text: #101010;
--WS-col-link: orange;
--WS-col-link-hover: orangered;
	
/* MENU DESKTOP */
--WS-col-menu-background: #222;
--WS-col-menu-item-background: transparent;
--WS-col-menu-item-text: #EEE;
--WS-col-menu-item-background-hover: #555;
--WS-col-menu-item-text-hover: #FFF;

--WS-menu-bar-font: 14px;
--WS--menu-bar-height: 24px;

/* MENU DESKTOP DROPDOWN*/
--WS-col-menu-dropdown-item-background: #333;
--WS-col-menu-dropdown-item-text: #EEE;
--WS-col-menu-dropdown-item-background-hover: #555;
--WS-col-menu-dropdown-item-text-hover: #FFF;

/* MENU MOBILE HAMB§URGER */
--WS-col-menu-mobile-hamburger-background: #EEE;
--WS-col-menu-mobile-hamburger-border: #222;

/* MENU DROPDOWN BAR */
--WS-col-menu-mobile-bar-background: #000;

/* MENU MOBILE ITEM */
--WS-col-menu-mobile-item-background: #333;
--WS-col-menu-mobile-item-text: #EEE;
--WS-col-menu-mobile-item-background-hover: #555;
--WS-col-menu-mobile-item-text-hover: #FFF;

/* MENU MOBILE SUB ITEM */
--WS-col-menu-mobile-sub-item-background: #666;
--WS-col-menu-mobile-sub-item-text: #EEE;
--WS-col-menu-sub-item-background-hover: #555;
--WS-col-menu-mobile-sub-item-text-hover: #FFF;


/* BUTTONS */
--WS-col-button-background: linear-gradient(to top, #aaaaaa 0%, #eeeeee 100%);
--WS-col-button-text: #303030;
--WS-col-button-border: #808080;
--WS-col-button-text-hover: white;
--WS-col-button-background-hover: linear-gradient(to top, orangered 0%, orange 100%);

/* POPUP */
--WS-col-popup-header-border: #505050;
--WS-col-popup-header-background: rgba(7,7,7,0.6);
--WS-col-popup-header-text: #E0E0E0;
--WS-col-popup-header-button-background: #D00000;
--WS-col-popup-header-button-text: #E0E0E0;
--WS-col-popup-header-button-background-hover: #F00000;
--WS-col-popup-header-button-text-hover: #E0E0E0;
--WS-col-popup-background: #E0E0E0;
--WS-col-popup-text: #101010;

/* SUB TEMPLATE EDIT MODE */
--WS-col-sub-template-border: #6060f0;

/* SLIDER CARO§USEL */
--WS-col-slider-btn-background: rgba(4,4,4,0.2);
--WS-col-slider-btn-background-hover: rgba(4,4,4,0.8);
--WS-col-slider-btn-text: #f0f0f0;
--WS-col-slider-btn-text-hover: orangered;

/* FONT SIZE */
--WS-font-title: 22px;
--WS-font-body-h2: 20px;
--WS-font-body-h1: 18px;
--WS-font-body-h0: 16px;

--WS-menu-bar-font: 14px;
--WS--menu-bar-height: 24px;

--WS-preheader-font: 14px;
}

.no-padding
{
	padding:0;
}

html, html > a, html > div
{
	font-family:var(--WS-font-type);
}

/* DIMAMIC FONT SIZE */
@media (pointer:none), (pointer:coarse)
{
:root{
    --WS-font-title: 30px;
    --WS-font-body-h2: 28px;
    --WS-font-body-h1: 26px;
    --WS-font-body-h0: 24px;
    
    --WS-menu-bar-font: 24px;
    --WS--menu-bar-height: 36px;
    
    --WS-preheader-font: 15px;
    }
      
    .ws_menu_mobile_dropdown_box 
    {
        font-size:24px;
        height:36px;
    }
    
    .ws_menu_mobile_button_rows
    {
        height:10px;
        margin:0px;
        margin-right:15px;
        margin-top:8px;
        border-radius:4px;
        width:60px;
    }
}

/* -------------------------------------------- */
/* ------------------- BODY --------------------*/
/* -------------------------------------------- */
body
{
    height: 100%;
    height: 100vh;
    background-color:var(--WS-col-background);
    color: var(--WS-col-text);
    margin:0px;
    padding: 0px;
    min-width:600px;
    font-weight: normal;
    cursor: default;
}

/* -------------------------------------------- */
/* ----------------- LINKS ---------------------*/ 
/* -------------------------------------------- */
a
{
	color:var(--WS-col-link);
	text-decoration:none;
}
a:hover
{
	color:var(--WS-col-link-hover);
}


/* -------------------------------------------- */
/*--------------- PRIVATE MENU -----------------*/
/* -------------------------------------------- */
.ws_menu_bar
{
	background-color: var(--WS-col-menu-background);
}

.ws_menu_bar a
{
	text-decoration: none;
}

/* ITEM IN THE ORIZZONTAL MENU BAR */
 .ws_menu_box
{
    text-decoration:none;
    background-color:var(--WS-col-menu-item-background);
	border-top:none;
    color: var(--WS-col-menu-item-text);
	border-top:solid 3px transparent;
    font-size:20px;
    vertical-align:central;
	white-space: nowrap;
    color: white;
	height:32px;
	padding:8px 12px 0px 16px;
	margin:0px;
	transition-property: all;
	transition-duration: 0.5s;
	cursor:pointer;
}

.ws_menu_box:hover 
{
	background-color:var(--WS-col-menu-item-background-hover);
    color:var(--WS-col-menu-item-text-hover);
	border-top:solid 3px var(--WS-col-menu-item-text-hover);
	transition-property: all;
	transition-duration: 0.5s;
}

.ws_menu_selected
{
    border:none;	/* NO ACTIVE*/
}

/* VERICAL MENU BAR */
.ws_menu_dropdown_bar
{
	background-color: var(--WS-col-menu-bar-background);
	border:solid 1px #606060;
}

 /* DESKTOP VERICAL MENU ITEM  */
 
.ws_menu_dropdown_box
{
	font-size:20px;
	background-color: var(--WS-col-menu-dropdown-item-background);
    color: var(--WS-col-menu-dropdown-item-text);
	text-decoration: none;
	white-space: nowrap;
	height:40px;
	padding:10px 0px 0px 10px;		/* top,right,bottom,left */
	width:200px;
	border-bottom:solid 1px #505050;
	transition-property: all;
	transition-duration: 0.5s;
}

.ws_menu_dropdown_box:hover
{
	background-color: var(--WS-col-menu-dropdown-item-background-hover);
    color: var(--WS-col-menu-dropdown-item-text-hover);
	transition-property: all;
	transition-duration: 0.5s;
}


/* ------------------------- */
/*      MENU MOBILE          */
/* ------------------------- */

/* BUTTON HAMBURGER ROWS */
.ws_menu_mobile_button_rows
{
	height:4px;
    margin:0;
	margin-left:4px;
	margin-right:15px;
	margin-top:1px;
	border:solid 2px var(--WS-col-menu-mobile-hamburger-border);
	background-color: var(--WS-col-menu-mobile-hamburger-background);
	border-radius: 2px;
	z-index:1000;
	width:40px;
	transition-property: all;
	transition-duration: 0.5s;
}

/* MOBILE BAR BACKGROUND */
.ws_menu_mobile_dropdown_bar
{
    background-color: var(--WS-col-menu-mobile-bar-background);
	width:100%;
	transition-property: all;
	transition-duration: 0.5s;
	 
	/* POSIZIONAMENTO BARRA MENU MOBILE */
	position:fixed;
	top:0px;
	left:0px;
	margin:0px;
	padding:0px; 
}


/* MENU MOBILE ITEMS */
.ws_menu_mobile_dropdown_box
{
	display:flex;
	font-size:26px;
    height:40px;
	width:100%;
	text-decoration:none;
    background-color:var(--WS-col-menu-mobile-item-background);
    color: var(--WS-col-menu-mobile-item-text);
	padding:14px 0px 10px 20px;		/* top,right,bottom,left */
	transition-property: all;
	transition-duration: 0.5s;
}

/* MENU MOBILE ITEMS (HOVER)*/
.ws_menu_mobile_dropdown_box:hover
{
    background-color:var(--WS-col-menu-mobile-item-background-hover);
    color: var(--WS-col-menu-mobile-item-text-hover);
	transition-property: all;
	transition-duration: 0.5s;
}

/* SUB MENU MOBILE ITEMS */
.ws_sub_menu_mobile
{
    background-color:var(--WS-col-menu-mobile-sub-item-background);
    color: var(--WS-col-menu-mobile-sub-item-text);
	padding-left:30px;
	transition-property: all;
	transition-duration: 0.5s;
}

/* SUB MENU MOBILE ITEMS (HOVER) */
.ws_menu_mobile_dropdown_box:hover .ws_sub_menu_mobile
{
    background-color:var(--WS-col-menu-mobile-sub-item-background-hover);
    color: var(--WS-col-menu-mobile-sub-item-text-hover);
	transition-property: all;
	transition-duration: 0.5s;
}

/* MENU ARROW */
.ws_menu_mobile_arrow_open
{
	transform:rotate(90deg);
	transition-property: all;
	transition-duration: 0.5s;
}

.ws_menu_mobile_arrow
{
	margin-right: 50px;
	vertical-align:middle;
	text-align:center;
	margin-left: auto;
	transition-property: all;
	transition-duration: 0.5s;
}

/* ------------------------- */
/*    ATTIVATORI MENU        */
/* ------------------------- */
.ws_menu_dropdown_act,
.ws_menu_open_button_act
{
	z-index:1000;
    display: none;
    position: absolute;
}

.ws_menu_open_button
{
    display:none;
    margin:0px;
    padding:8px;
	transition-property: all;
	transition-duration: 0.5s;
}

/* ENABLE RESPONSIVE MENU DESKTOP / MOBILE */
@media only screen and (max-width: 940px)
{
    .ws_menu_desktop_conteiner{display:none;}
    .ws_menu_open_button{display:block;overflow-y:visible}
}

@media (pointer:none), (pointer:coarse)
{
    .ws_menu_desktop_conteiner{display:none;}
    .ws_menu_open_button{display:block;overflow-y:visible}
}

/* -------------------------------------------- */
/* ------------------ POPUP --------------------*/
/* -------------------------------------------- */
.ws_popup_bg
{
	z-index:5000;
	position:fixed;
	width:100%;
	height:100%;
	top:0px;
	left:0px;
	background-color:rgba(5,5,5,.4)
}

.ws_popup_bar_cont
{
	z-index:4999;
	position:relative;
	vertical-align:top;
	height:30px;
	background-color:var(--WS-col-popup-header-background);
}

.ws_popup_bar
{
	z-index:5000;
	position:relative;
	vertical-align:top;
	font-size:20px;
	height:30px;
	border:solid 1px var(--WS-col-popup-header-border);
	color:var(--WS-col-popup-header-text);
}

.ws_popup_bar input[type=submit]
{
	z-index:5000;
	font-size:20px;
	float:right;
	border:none;
	height:30px;
	width:40px;
	cursor:pointer;
	transition-property: all;
	transition-duration: 0.5s;
	background-color:var(--WS-col-popup-header-button-background);
	color:var(--WS-col-popup-header-button-text);
}

.ws_popup_bar input[type=submit]:hover
{
	background-color:var(--WS-col-popup-header-button-background-hover);
	color:var(--WS-col-popup-header-button-text-hover);
	transition-property: all;
	transition-duration: 0.5s;
}

.ws_popup_body
{
	position:relative;
	overflow-x:hidden;
	overflow-y:hidden;
	font-size:11px;
	color:black;
	position:relative;
	margin:auto;
	border:1px solid black;
	background-color:var(--WS-col-popup-background);
	color:var(--WS-col-popup-text);
	margin: 10px;
}

/* -------------------------------------------- */
/* ------------------ TABS --------------------*/
/* -------------------------------------------- */
.ws_TabLab
{	
	font-size:20px;
	color:var(--WS-col-text);
	border-top:solid 1px black;
	border-right:solid 1px black;
	border-left:solid 1px black;
	border-bottom:none;
	min-width:150px;
	height:30px;
	margin-right: 1px;
	border-radius: 5px 5px 0px 0px;
	padding:5px;
	background-color: #a0a0a0;
}
.ws_TabLab:hover
{
	background:var(--WS-col-button-background-hover);
}

/* -------------------------------------------- */
/* ------------------ TEXTBOX ------------------*/
/* -------------------------------------------- */
.ws_text, .ws_text input
{
	color:var(--WS-col-text);
	font-size:16px;
	border-radius:3px;
}

.ws_text_small, .ws_text_small input
{
	font-size:12px;
}

.ws_text_big, .ws_text_big input
{
	font-size:24px;
}

.ws_text_xl, .ws_text_xl input
{
	font-size:32px;
}

/* -------------------------------------------- */
/* ------------------ GRIDS ------------------*/
/* -------------------------------------------- */
.ws_grid_table
{
	width:100%;
	margin:auto;
	border:none;
	width:90%;
	
}

.ws_grid_header
{
	margin:auto;
	font-size:18px;
	background-color: transparent;
	color:white;
	
}

.ws_grid_row
{
	background-color: transparent;
	font-size:18px;
	text-align:left;
	padding:5px;
	
}

.ws_grid_alternate_row
{
	background-color: transparent;
	font-size:18px;
	text-align:left;
	padding:5px;
}

.ws_grid_button
{
        background:var(--WS-col-button-background);
        border:solid 1px var(--WS-col-button-border);
		color:var(--WS-col-button-text);
        font-size:16px;
		padding-top:5px;
		padding-bottom:5px;
		border-radius:3px;
		transition-property: all;
		transition-duration: 0.5s;
}
.ws_grid_button:hover
{
	border:solid 1px var(--WS-col-button-border);
	background:var(--WS-col-button-background-hover);
	color:var(--WS-col-button-text-hover);
	transition-property: all;
	transition-duration: 0.5s;
}

/* -------------------------------------------- */
/* ------------------ BUTTONS ------------------*/
/* -------------------------------------------- */

input[type=submit], input[type=button], input[type=file]
{
	cursor:pointer;
}

/* UPLOAD FILE BUTTON */
::-webkit-file-upload-button
{
	background:var(--WS-col-button-background);
	border:solid 1px var(--WS-col-button-border);
	color:var(--WS-col-button-text);
	font-size:20px;
	padding:5px 10px 5px 10px;
	border-radius:3px;
	cursor:pointer;
	transition-property: all;
	transition-duration: 0.5s;
}

::-webkit-file-upload-button:hover
{
	background:var(--WS-col-button-background-hover);
	border:solid 1px var(--WS-col-button-border);
	transition-property: all;
	transition-duration: 0.5s;
}

.ws_button
{
	background:var(--WS-col-button-background);
	border:solid 1px var(--WS-col-button-border);
	color:var(--WS-col-button-text);
	font-size:20px;
	padding:5px 10px 5px 10px;
	border-radius:3px;
	cursor:pointer;
	transition-property: all;
	transition-duration: 0.5s;
}

.ws_button:hover
{
	background:var(--WS-col-button-background-hover);
	border:solid 1px var(--WS-col-button-border-hover);
	border:solid 1px var(--WS-col-button-border);
	transition-property: all;
	transition-duration: 0.5s;
}
.ws_button_big
{
	font-size:24px;
	padding:8px 20px 8px 20px;
}

.ws_button_small
{
	font-size:16px;
	padding:3px 8px 3px 8px;
}

.ws_button_mini
{
	font-size:12px;
	padding:2px 5px 2px 5px;
}

/* -------------------------------------------- */
/* ------------------ TABS ------------------*/
/* -------------------------------------------- */
.ws_tabs
{
	margin:20px;
}

.ws_tabs_label
{
	background-color: silver;
	border-top:solid 1px #606060;
	border-left:solid 1px #606060;
	border-right:solid 1px #606060;
	border-bottom:solid 1px #606060;
	border-radius: 5px 5px 0 0;
	padding:10px;
	padding-right:30px;
	padding-left:30px;
	cursor: pointer;
	min-width:12%;
}

.ws_tabs_label_active
{
	background-color: white;
}

.ws_tabs_body
{
	padding:10px;
	border:solid 1px #606060;
}

.ws_tabs_body_active
{
}


/* -------------------------------------------- */
/* ------------------ SLIDER ------------------*/
/* -------------------------------------------- */


/* Slideshow container */
.ws_slider_container {
  width: 100%;
}

/* Hide the images by default */
.ws_slider_Slides {
}

.ws_slider_Slides img {
}

/* Next & previous buttons */
.ws_slider_prev, .ws_slider_next {
  background-color: var(--WS-col-slider-btn-background);
  color: var(--WS-col-slider-btn-text);
}


/* On hover, add a black background color with a little bit see-through */
.ws_slider_prev:hover, .ws_slider_next:hover {
	background-color: var(--WS-col-slider-btn-background-hover);
	color: var(--WS-col-slider-btn-text-hover);
}

/* The dots/bullets/indicators */
.ws_slider_dot {
  background-color: #bbb;
  border-radius: 50%;
  transition: background-color 0.6s ease;
}

.ws_slider_active, .ws_slider_dot:hover {
  background-color: #717171;
}

/* Fading animation */
.ws_slider_fade {
  animation-name: fade;
  animation-duration: 1.5s;
}

@keyframes ws_slider_fade {
  from {opacity: .4}
  to {opacity: 1}
}


/* -------------------------------------------- */
/* ------------- EDIT MINI BUTTONS -------------*/
/* -------------------------------------------- */
.ws_btnedit
{
	/*float:left;*/
	font-size: 8px;
	cursor:pointer;
	width:35px;
	height:35px;
	min-width:35px;
	min-height:35px;
	background-size: cover;
	border:solid 1px var(--WS-col-button-border);
	background-color: #ffffff;
	vertical-align:top;
    border-radius: 30%;
}

.ws_btnedit-t
{background-image:url('../../Lib/Images/Edit.png');}

.ws_btnedit-pl
{background-image:url('../../Lib/Images/EditPlug.png');}

.ws_btnedit-vid
{background-image:url('../../Lib/Images/EditVid.png');}

.ws_btnedit-im
{background-image:url('../../Lib/Images/EditImg.png');}

.ws_btnedit-n
{background-image:url('../../Lib/Images/Edit.png');}

.ws_btnedit-co
{background-image:url('../../Lib/Images/EditCol.png');}

.ws_btnedit-mn
{background-image:url('../../Lib/Images/EditMenu.png');}

.ws_btnedit-mp
{background-image:url('../../Lib/Images/EditMap.png');}

.ws_btnedit-in
{background-image:url('../../Lib/Images/EditInp.png');}

.ws_btnedit-pp
{background-image:url('../../Lib/Images/EditPayPal.png');}

.ws_btnedit-sub
{background-image:url('../../Lib/Images/EditSubTem.png');}

.ws_btnedit-tab
{background-image:url('../../Lib/Images/EditTab.png');}

.ws_btncopy-sub
{background-image:url('../../Lib/Images/EditCopy.png');}

.ws_btnpaste-sub
{background-image:url('../../Lib/Images/EditPaste.png');}

.ws_config_block
{
	width:550px;
	text-align: center;
	position: relative;
	margin:auto;
	text-align: right;
}

.ws_imgToDiv
{
	background-repeat:no-repeat;
	background-color:transparent;
	background-position: center;
    background-position: center;
	background-size: contain;
}

.ws_imgSlideOut
{
	opacity:0;
	-webkit-transition: opacity 1s ease-out;
	-moz-transition: opacity 1s ease-out;
	-o-transition: opacity 1s ease-out;
	transition: opacity 1s ease-out;
}

.ws_imgSlideIn
{
	opacity:1;
	-webkit-transition: opacity 1s ease-in;
	-moz-transition: opacity 1s ease-in;
	-o-transition: opacity 1s ease-in;
	transition: opacity 1s ease-in;
}

.ws_scroll_menu_frec
{
	z-index:10000;
	position:fixed;
	border-radius:0px 3px 3px 0px;
	border:solid 1px #555555;
	border-left:solid 1px silver;
	color:#ddd;
	text-decoration:blink;
	left:5px;
	top:49%;
	background-color:#000;
	font-size:10px;
	transition-property: all;
	transition-duration: 0.3s;
	
}

.ws_scroll_menu
{
	font-size:12px;
	z-index:10000;
	position:fixed;
	border-radius:0px 3px 3px 0px;
	border:solid 1px #555555;
	border-left:solid 1px silver;
	color:#ddd;
	padding-top:5px;
	top:0;
	height:100%;
	left:0px;
	overflow:hidden;
	background-color:#000;
	width:5px;
	padding-bottom:5px;
	transition-property: all;
	transition-duration: 0.3s;
}

.ws_scroll_menu_text
{
	font-size:10px;
	text-align:center;
	background-color:#444;
	color:orangered;
	border:none;
	width:132px;
	margin:auto;
	margin-top:3px;
	margin-bottom:8px;
}

.ws_scroll_menu_sep
{
	width:120px;
	height:1px;
	margin:3px;
	margin-left:5px;
	margin-right:5px;
	border-top:solid 1px #666666;
}

.ws_scroll_menu_btn
{
	font-size:12px;
	color:#ddd;
	background:linear-gradient(to top, #111 0%, #333 100%);
	margin:2px;
	padding-top:0px;
	padding-bottom:0px;
	width:128px;
	height:22px;
	text-align: center;
    border:none;
	border-radius: 0px;
	transition-property: all;
	transition-duration: 0.5s;
}

.ws_scroll_menu_btn:hover
{
	color:white;
	background: linear-gradient(to top, orangered 0%, orange 100%);
	transition-property: all;
	transition-duration: 0.5s;
}

.ws_scroll_menu_pglist
{
	color:#333333;
	margin-left:5px;
	width:160px;
	height:350px;
}

/*portrait e-readers (Nook/Kindle), smaller tablets @ 600 or @ 640 wide.  */
@media (pointer:none), (pointer:coarse)
{
:root{
    --WS-font-title: 30px;
	--WS-font-body-h2: 28px;
	--WS-font-body-h1: 26px;
	--WS-font-body-h0: 24px;
    
    --WS-menu-bar-font: 24px;
    --WS--menu-bar-height: 36px;
    
    --WS-preheader-font: 15px;
    }
    
    .ws_menu_mobile_dropdown_box 
    {
        font-size:24px;
        height:36px;
    }
    
    .ws_menu_mobile_button_rows
    {
        height:10px;
        margin:0px;
        margin-right:15px;
        margin-top:8px;
        border-radius:4px;
        width:60px;
    }
}


/* -------------------------------------------- */
/* ----------------- DIV STYLE -----------------*/
/* -------------------------------------------- */
.ws_absolute {position:absolute;}
.ws_relative {position:relative;}
.ws_fixed {position:fixed;}

.ws_tab {display:table;}
.ws_row {display:table-row;}
.ws_cell {display:table-cell;}
.ws_tr {display:table-row;}
.ws_td {display:table-cell;}

.ws_inline {display:inline;}
.ws_block {display:block;}
.ws_inline_block {display:inline-block;}
.ws_flex {display:flex;}
.ws_hidden {display:none;}
.ws_central {margin:0 auto;}

.ws_txt_nowrap {white-space:nowrap}
.ws_txt_center {text-align:center}
.ws_txt_left {text-align:left}
.ws_txt_right {text-align:right}
.ws_txt_justify {text-align:justify}

.ws_v_top {vertical-align:top;}
.ws_v_bottom {vertical-align:bottom;}
.ws_v_central {vertical-align:middle;}

.ws_full_width {width:100%;}
.ws_width_100p {width:100%;}
.ws_width_99p {width:99%;}
.ws_width_95p {width:95%;}
.ws_width_90p {width:90%;}
.ws_width_80p {width:80%;}
.ws_width_70p {width:70%;}
.ws_width_60p {width:60%;}
.ws_width_50p {width:50%;}
.ws_width_40p {width:40%;}
.ws_width_33p {width:33%;}
.ws_width_25p {width:25%;}
.ws_width_20p {width:20%;}
.ws_width_10p {width:10%;}
.ws_width_1p {width:1%;}

.ws_width_1000 {width:1000px;}
.ws_width_800 {width:800px;}
.ws_width_600 {width:600px;}
.ws_width_400 {width:500px;}
.ws_width_300 {width:300px;}
.ws_width_200 {width:200px;}
.ws_width_150 {width:150px;}
.ws_width_100 {width:100px;}
.ws_width_90 {width:90px;}
.ws_width_80 {width:80px;}
.ws_width_70 {width:70px;}
.ws_width_60 {width:60px;}
.ws_width_50 {width:50px;}
.ws_width_40 {width:40px;}
.ws_width_30 {width:30px;}
.ws_width_25 {width:25px;}
.ws_width_20 {width:20px;}
.ws_width_10 {width:10px;}

.ws_full_height {height:100%;}
.ws_height_100p {height:100%;}
.ws_height_75p {height:75%;}
.ws_height_50p {height:50%;}
.ws_height_25p {height:25%;}

.ws_height_400 {height:400px;}
.ws_height_300 {height:300px;}
.ws_height_200 {height:200px;}
.ws_height_150 {height:150px;}
.ws_height_100 {height:100px;}
.ws_height_90 {height:90px;}
.ws_height_80 {height:80px;}
.ws_height_70 {height:70px;}
.ws_height_60 {height:60px;}
.ws_height_50 {height:50px;}
.ws_height_40 {height:40px;}
.ws_height_30 {height:30px;}
.ws_height_25 {height:25px;}
.ws_height_20 {height:20px;}
.ws_height_10 {height:10px;}

.ws_2_cols {width:49%;}
.ws_3_cols {width:33%;}
.ws_4_cols {width:25%;}

.ws_float_l {float:left;}
.ws_float_r {float:right;}
.ws_scroll {overflow:auto;}
.ws_scroll_x {overflow-x:auto;}
.ws_scroll_y {overflow-y:auto;}

.ws_bordered{border:solid 1px silver;}
.ws_bordered_black{border:solid 1px #222;}
.ws_rounded{border-radius:50%;}
.ws_rounded_10{border-radius:10px;}
.ws_rounded_20{border-radius:20px;}
.ws_tranparent{background: rgba(0,0,0,0.5)}


/* PADDING */
.ws_padd_0{padding:0}
.ws_padd_5{padding:5px}
.ws_padd_10{padding:10px}
.ws_padd_20{padding:20px}
.ws_padd_30{padding:30px}
.ws_padd_40{padding:40px}
.ws_padd_50{padding:50px}
.ws_padd_100{padding:100px}

.ws_padd_r_0{padding-right:0}
.ws_padd_r_5{padding-right:5px}
.ws_padd_r_10{padding-right:10px}
.ws_padd_r_20{padding-right:20px}
.ws_padd_r_30{padding-right:30px}
.ws_padd_r_40{padding-right:40px}
.ws_padd_r_50{padding-right:50px}
.ws_padd_r_100{padding-right:100px}

.ws_padd_l_0{padding-left:0}
.ws_padd_l_5{padding-left:5px}
.ws_padd_l_10{padding-left:10px}
.ws_padd_l_20{padding-left:20px}
.ws_padd_l_30{padding-left:30px}
.ws_padd_l_40{padding-left:40px}
.ws_padd_l_50{padding-left:50px}
.ws_padd_l_100{padding-left:100px}

.ws_padd_t_0{padding-top:0}
.ws_padd_t_5{padding-top:5px}
.ws_padd_t_10{padding-top:10px}
.ws_padd_t_20{padding-top:20px}
.ws_padd_t_30{padding-top:30px}
.ws_padd_t_40{padding-top:40px}
.ws_padd_t_50{padding-top:50px}
.ws_padd_t_100{padding-top:100px}

.ws_padd_b_0{padding-bottom:0}
.ws_padd_b_5{padding-bottom:5px}
.ws_padd_b_10{padding-bottom:10px}
.ws_padd_b_20{padding-bottom:20px}
.ws_padd_b_30{padding-bottom:30px}
.ws_padd_b_40{padding-bottom:40px}
.ws_padd_b_50{padding-bottom:50px}
.ws_padd_b_100{padding-bottom:100px}

.ws_margin_0{margin:0}
.ws_margin_5{margin:5px}
.ws_margin_10{margin:10px}
.ws_margin_20{margin:20px}
.ws_margin_30{margin:30px}
.ws_margin_40{margin:40px}
.ws_margin_50{margin:50px}
.ws_margin_100{margin:100px}

/* MARGiN */
.ws_margin_r_0{margin-right:0}
.ws_margin_r_5{margin-right:5px}
.ws_margin_r_10{margin-right:10px}
.ws_margin_r_20{margin-right:20px}
.ws_margin_r_30{margin-right:30px}
.ws_margin_r_40{margin-right:40px}
.ws_margin_r_50{margin-right:50px}
.ws_margin_r_100{margin-right:100px}

.ws_margin_l_0{margin-left:0}
.ws_margin_l_5{margin-left:5px}
.ws_margin_l_10{margin-left:10px}
.ws_margin_l_20{margin-left:20px}
.ws_margin_l_30{margin-left:30px}
.ws_margin_l_40{margin-left:40px}
.ws_margin_l_50{margin-left:50px}
.ws_margin_l_100{margin-left:100px}

.ws_margin_t_0{margin-top:0}
.ws_margin_t_5{margin-top:5px}
.ws_margin_t_10{margin-top:10px}
.ws_margin_t_20{margin-top:20px}
.ws_margin_t_30{margin-top:30px}
.ws_margin_t_40{margin-top:40px}
.ws_margin_t_50{margin-top:50px}
.ws_margin_t_100{margin-top:100px}

.ws_margin_b_0{margin-bottom:0}
.ws_margin_b_5{margin-bottom:5px}
.ws_margin_b_10{margin-bottom:10px}
.ws_margin_b_20{margin-bottom:20px}
.ws_margin_b_30{margin-bottom:30px}
.ws_margin_b_40{margin-bottom:40px}
.ws_margin_b_50{margin-bottom:50px}
.ws_margin_b_100{margin-bottom:100px}

/* -------------------------------------------- */
/* ----------------- FONT STYLE ----------------*/
/* -------------------------------------------- */
.ws_font_10{font-size:10px;}
.ws_font_15{font-size:15px;}
.ws_font_20{font-size:20px;}
.ws_font_25{font-size:25px;}
.ws_font_30{font-size:30px;}
.ws_font_40{font-size:40px;}
.ws_font_50{font-size:50px;}
.ws_font_60{font-size:60px;}





/* -------------------------------------------- */
/* --------------- IMAGE EFFECTS ---------------*/
/* -------------------------------------------- */
.ws_jamp_up
{
    -webkit-transition: all 300ms ease-out;
    -webkit-transform: scale(1); 
    -ms-transition: all 300ms ease-out;
    -ms-transform: scale(1); 
    -moz-transition: all 300ms ease-out;
    -moz-transform: scale(1);
    transition: all 300ms ease-out;
    transform: scale(1); 
}

.ws_jamp_up:hover
{
    -webkit-transition: all 300ms ease-in;
    -webkit-transform: scale(1.1);
    -ms-transition: all 300ms ease-in;
    -ms-transform: scale(1.1);   
    -moz-transition: all 300ms ease-in;
    -moz-transform: scale(1.1);
    transition: all 300ms ease-in;
    transform: scale(1.1);
}

.ws_tilt:hover
{
    -ms-transform:rotate(10deg); 
    -webkit-transform: rotate(10deg); 
     transform: rotate(10deg);
}

.ws_red_shadow:hover
{
   box-shadow: 0px 0px 7px 3px red;
}

.ws_green_shadow:hover
{
   box-shadow: 0px 0px 7px 3px green;
}

.ws_blue_shadow:hover
{
   box-shadow: 0px 0px 7px 3px blue;
}

.ws_orange_shadow:hover
{
   box-shadow: 0px 0px 6px 3px coral;
}

.ws_gray_shadow:hover
{
   box-shadow: 0px 0px 6px 3px gray;
}

.ws_highlight
{
	-moz-opacity: 0.4;
    opacity: 0.4;
}
.ws_highlight:hover 
{
	-moz-opacity: 0.9;
    opacity: .9;
}

.ws_rotate_Y:hover 
{
    -webkit-transition:all 1s;
    -moz-transition:all 1s;
    transition:all 1s
    -webkit-transform:rotateY(360deg);
    -moz-transform:rotateY(360deg);
    transform:rotateY(360deg)
}

.ws_rotate_Z:hover 
{
    -webkit-transition:all 1s;
    -moz-transition:all 1s;
    transition:all 1s
    -webkit-transform:rotateZ(360deg);
    -moz-transform:rotateZ(360deg);
    transform:rotateZ(360deg)
}

.ws_gray_scale 
{ 
-webkit-filter: grayscale(100%);
filter: grayscale(100%);
}

.ws_gray_scale:hover { 
-webkit-filter: grayscale(0%);
filter: grayscale(0%);
}

.ws_circle
{
   border-radius: 50%;
}

.ws_gray_oblo
{
   border-radius: 50%;
   border:solid 6px #666666;
   box-shadow: 0px 0px 0px 1px #444444;
}

.ws_white_oblo
{
   border-radius: 50%;
   border:solid 6px #ffffff;
   box-shadow: 0px 0px 0px 1px #444444;
}

.ws_transparent
{
	opacity:0.5;
}

.ws_align_top
{
	vertical-align:top;
}

