@font-face {
	font-family: 'GothicRegular';
	src: url('GothicRegular.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
    font-family: 'GothicBold';
    src: url('GothicBold.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
/* RESET HTML5 */
article, aside, footer, figure, header, nav, section { display: block;}

body {
	margin: 0;
	padding: 0;
	font-family: "GothicRegular" !important;
    background: #fff
}

a {text-decoration:none;}

cite { font-weight: bold; font-size: 14px}

h1, h2, h3 { display: block;}

img { border: none;}

ul { list-style-type: none;}

/*     Structura   ----

#wrap-header 
    #header 
#container 
    #main-content 
    #wrap-footer 
       #footer_block 
       #footer 

-------      */

#wrap-header {
	width: 100%;
	height: 90px;
	clear: both;
	background: url(../img/bg_header.gif) repeat-x bottom;
	margin-top: 20px;
}   
    #header {
    	width: 910px;
    	height: 90px;
    	margin: 0px auto;
    }

    #header h1 img { width: auto; height: 90px; float: left; margin-left: 30px}
    #menu {
    	width: 680px;
    	height: 40px;
    	float: right;
        text-align: right;
    } 
        #menu ul { margin-top: 62px}
        #menu ul li { display: inline-block;}
        #menu ul li a, #menu ul li a:visited{
        	font-size: 1.2em;
        	margin-left: 20px;
        	letter-spacing: 2px;
        	-webkit-transition: color 0.25s ease-out;
	        -moz-transition: color 0.25s ease-out;
	        -o-transition: color 0.25s ease-out;
	        transition: color 0.25s ease-out;
	        color: #e4e4e4;
	        outline: none;
	        text-decoration:none;
        }
        #menu ul li a:hover, #menu ul li.current { color: #999; }

        #menu ul .current {
            font-size: 1.2em;
            margin-left: 20px;
            letter-spacing: 2px;
            -webkit-transition: color 0.25s ease-out;
            -moz-transition: color 0.25s ease-out;
            -o-transition: color 0.25s ease-out;
            transition: color 0.25s ease-out;
            color: #999;
            outline: none;
            text-decoration:none;
        }
        #lang {
        	position: relative;
        	top: 25px;
        	left: 700px;
        	font-size: 12px;
            color: #999
        }
        #lang a {
        	text-transform: uppercase;
        	-webkit-transition: color 0.5s ease-out;
	        -moz-transition: color 0.5s ease-out;
	        -o-transition: color 0.5s ease-out;
	        transition: color 0.5s ease-out;
        	color: #999
        }
        #lang a:hover {color: #333}

#container {
	width: 960px;
	margin: 0px auto;
}
    
    #main-content {
    	height: 370px;
        min-width: 300px;
        max-width: 960px;
        background: url(../img/shadow.jpg) no-repeat;
        margin-top: 15px;
        padding: 2px 15px
    }

    

    #color_content {
        width: 910px;
        height: 339px;
        margin: 0 auto;
    } 

    .rojo:first-letter { color: red}  


    

/*
 * jQuery Blueberry Slider v0.4 BETA
 * http://marktyrrell.com/labs/blueberry/
 *
 * Copyright (C) 2011, Mark Tyrrell <me@marktyrrell.com>
 *
 * This program is free software: you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published by
 * the Free Software Foundation, either version 3 of the License, or
 * (at your option) any later version.
 *
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU General Public License for more details.
 *
 */

.blueberry { margin: 0 auto; 
    max-width: 940px;}
.blueberry .slides {
    display: block;
    position: relative;
    overflow: hidden;
    margin-left: 11px
}
.blueberry .slides li {
    position: absolute;
    top: -10px;
    left: -20px;
    overflow: hidden;
}
.blueberry .slides li img {
    display: block;
    max-width: 927px;
}
.blueberry .slides li.active { display: block; position: absolute; }
.blueberry .crop li img { width: auto; }  


/*  +++++++++++++++++++++++++++++
+++++   ABIL CLINIC ++++++++++++
++++++++++++++++++++++++++++++++  */

#color_content .foto-material {
            width: 480px;
            height: 339px;
            float: right;
        }


.abil-clinic{
            width: 422px;
            float: left;
            text-align: justify;
        }
        .abil-clinic p {
        	padding: 12px 18px 0px 25px; 
        	height: 220px;
        	width: auto;
            font-size: 11px !important;
            line-height: 13px;
        }
#gallery {float: left;position: relative; width: 580px; height:300px;font-size:12px;}
    #gallery h3 {font-size: 16px;text-shadow: none;}
    #gallery a { float:left; position:absolute; }
    #gallery a img {border:none;width: 480px;height: 339px}
    #gallery a.show {z-index:500}

        .abil-clinic .blanco { color: white}
        .abil-clinic .negro { color: black}
        
        /*  Secondary Menu -- ABIL CLINIC -- */
        #secondary_nav {
            display: block;
            width: 405px;
            margin: 0;
            padding: 14px;
        }

        #secondary_nav li {
            display: inline-block;
            font-size: 14px;
            padding: 3px 0 3px 12px;
            text-shadow: 1px 1px 1px #000;
        }

        #secondary_nav a { color: #fff}
        #secondary_nav a:hover, #secondary_nav .current { color: #999}

/*  ++++++++++++++++++++++
+++     SERVICES  ++++++++
+++++++++++++++++++++++  */

.services {
            width: 415px;
            float: left;
        }
        .services  h4 {
            font-size: 14px;
            margin: 8px 0 4px 0;
        }
        .services p {
            width: auto;
            font-size: 12px !important;
            line-height: 13px;
            margin: 2px 5px 0px 10px;  
            height: 228px;
            color: #000;
            text-align: justify;
        }

        /*  Secondary Menu -- SERVICES -- */
        #nav_services {
            display: block;
            width: 450px;
            margin: 0;
            padding: 8px 0 8px 10px
        }
        #nav_services_bg {
            display: block;
            width: 450px;
            margin: 0;
            padding: 8px 4px
        }
        #nav_services li, #nav_services_bg li {
            display: inline-block;
            font-size: 12px;
            text-shadow: 1px 1px 1px #000;
        }
        #nav_services li {margin-left: 4px;}
        #nav_services_bg li {margin-left: 4px;}
        #nav_services a, #nav_services_bg a { color: #fff}

        #nav_services a:hover, 
        #nav_services .current,
        #nav_services_bg a:hover, 
        #nav_services_bg .current { color: #999}

        #symbol {
        	float: left;
            margin: 10px 10px 3px 10px;
            width: 51px;
            height: 51px
        }


/* +++++++++++++++++++++++++++++++++++++++++++++++++
                 NEWS SECTION 
 +++++++++++++++++++++++++++++++++++++++++++++ */
#main-content .bxslider .article {
    width: 450px;
    height: 260px;
    margin: 40px 0 0 40px;
    float: left;
    font-size: 12px;
    line-height: 14px;
    text-align: justify;
}  
    .article h2 {
        color: #333333;
        font-size: 14px;
        text-transform: uppercase;
        line-height: 16px;
        margin: 0
     }
     .article .read_more {
        display: block;
        margin-top: 30px;
        text-align: right;
        color: #999;
        font-size: 10px;
     }
     .article .read_more:hover {color: #666; }

#main-content .bxslider img {
    width: 320px;
    height: 220px;
    border: 5px solid #ccc;
    float: right;
    margin: 40px 40px 0 0;
}
  

/* +++++++++++++++++++++++++++++++++++++++++
  Пълният текст на новината article_news.php
+++++++++++++++++++++++++++++++++++++++++ */
#news-content {
    width: 960px;
} 
    #up, #down {
        width: 960px;
        float: left;
    }
    #up {background: url(../img/shadow_up.jpg) no-repeat; height: 147px}
    #down { background: url(../img/shadow_down.jpg) no-repeat; height: 195px }
    #publication {
        float: left;
        width: 844px;
        padding-left: 30px;
        padding-right: 60px;
        margin-left: 25px;
        background-color: #fff;
        background-image: url(../img/shadow_middle.jpg);
        background-position: right;
        background-repeat:  repeat-y;
        border-left: 1px solid #e4e4e4;       
    }
        #up h2 {
            font-size: 20px;
            color: #333333;
            font-weight: normal;
            text-transform: uppercase;
            position: relative;
            top: 60px;
            left: 67px;
            width: 85%;
            overflow: hidden;
        }
/*
        #publication img {
            display: block;
            width: 300px;
            height: 200px;
            float: left;
            margin: 0 30px 25px 0;
            box-shadow: 1px 1px 1px #333,
                        3px 6px 12px #666
        }
 */       
        #publication p { font-size: 12px; text-align: justify;}
        #publication p:first-letter { margin-left: 40px;}

        #down p {
            position: relative;
            top: 40px;
            left: 740px;
            font-size: .6em
        }
/*
***********************
       USEFUL
***********************
*/
#main-content .useful {
    width: 840px;
    height: 250px;
    margin: 15px 10px 15px 25px;
    text-align: justify;
    font-size: 12px;
    letter-spacing: 0,7px;
    line-height: 15px
}


/*
***********************
   CONTACT PAGE
***********************
*/    

#contact_info {
    width: 450px;
    height: 330px;
    float: left;
    padding: 20px 10px
}  

#contact_info img {
        width: 382px;
        height: 260px;
        margin: 25px 0 0 30px
    }

#contact_form {
    width: 370px;
    float: right;
    padding-right: 40px;
    text-align: right;
    }
table {
    border: 0;
    width: 100%;
    margin-top: 32px
}
    table td p, table span {
        font-size: 11px;
        line-height: 4px;
        margin-top: 5px;
        color: #999
    } 
   
    input {
        width: 180px;
        border: 1px solid #e4e4e4;
        border-radius: 0px;
        text-align: right;
        margin-bottom: 5px
    }  
    #submit { background: #fff; border: 0px; color: #666; font-size: 12px; text-align: right; padding: 0;}

    textarea {
        width: 360px;
        border: 1px solid #e4e4e4;
        text-align: right;
        height: 100px
    }
    .left-col { 
        text-align: left;
    }
    .right-col { 
        width: 180px;
        text-align: right;
    }
/*
***********************
   FOOTER
***********************
*/

#wrap-footer {
        background: #000;
        width: 910px;
        margin: 0 auto
    }
        #footer_block { 
            width: 100%;
            color: #e4e4e4
        }

        #footer_block .normal-width, #footer_block .estret {
            float: left;
            padding-left: 25px;
        }

        #footer_block .normal-width { width: 230px;}
        #footer_block .estret { width: 170px;}

        #footer_block h2 {
            font-size: 1.1em;
            font-weight: normal;
        }

        #footer_block .estret h2 { margin-left: 37px}
        
        #footer_block h2 a, #footer_block li a {color: #e4e4e4}
        #footer_block .current, #footer_block h2 a:hover, #footer_block li a:hover { color: #666}

        #footer_block .antes::before {
            content: "*";
            color: red;
            font-size: 16px;
            margin-right: 5px;
        }
        #footer_block .antes a { color: #e4e4e4}
        
        #footer_block p, #footer_block ul li {
            font-size: 0.7em;
            font-weight: normal;
        }
        /* #footer_block ul li {margin: 0} */
        #footer_block p {margin-bottom: 5px; }

        #footer_block .red-letter:first-letter {
            color: red;
            font-size: 14px
        }
        #contact_footer { float: right; width: 180px; margin-right: 10px}
        #contact_footer a { color: #999}
        #fb {width: 25px; height: auto;}
        #footer { 
            width: 100%;
            clear: both;
        }

        
        #footer a, #footer p { 
            color: #555; 
            font-size: 0.8em; 
            width: 408px; 
            display: inline-block;
            margin-left: 25px
        }

        #footer .maxa { text-align: right;}

        #footer span { color: #666; font-weight: bolder;}

@media screen and (min-width: 100px) and (max-width: 700px) {
    /*
    html, body { overflow-x: hidden;}
    #wrap-header {
        width:100%;
        background: #fff;
    }
        #header h1 {width: 100%}
        #header h1 img { 
        	width: 60px; 
        	height: auto
            
        }
        #menu {display: none;}

        #lang { left: -60px; top: 60px; font-size: 20px}
    #container {
    	width: 95%;
    	margin: 0 auto;
    }
        #main-content, #wrap-footer {background: #fff; width: 100%; height: auto;padding: 0}
        #main-content .blueberry { width: 100%}
        #main-content .slides img { width: 100%; height: auto;}

        #wrap-footer {}
        #footer_block { display: block; margin: 10px 0 10px 10px}
           #footer_block .normal-width, #footer_block .estret, #contact_footer { 
           	padding: 10px; 
           	color: #333; 
           	font-size: 18px;
           	background: #e4e4e4;
           	 margin: 10px 0; 
           	 float: none;
           	 width: 93%
           	}
           	#footer_block .estret ul { margin: 0; padding: 0;}
           #footer_block .estret li a, #footer_block h2, #footer_block h2 a {color: #666;}
           #contact_footer {
           	  text-align: left;
           }
           #footer 
    
*/
    
}

@media screen and (min-width: 701px) and (max-width: 959px){
    /*     Structura   ----

#wrap-header 
    #header 
#container 
    #main-content 
    #wrap-footer 
       #footer_block 
       #footer 

-------      */
    

}