

/*   ++++++++++++++++++++++++++++++++ main CSS Document for deep deep down ++++++++++++++++++++++++++++++++   */




/*   --- --- --- --- --- --- --- --- General definitions --- --- --- --- --- --- --- ---   */

html {
	/* CSS generated gradient */
	background: rgb(15,25,79); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(15,25,79,1) 0%, rgba(0,208,255,1) 97%, rgba(0,208,255,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(15,25,79,1)), color-stop(97%,rgba(0,208,255,1)), color-stop(100%,rgba(0,208,255,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(15,25,79,1) 0%,rgba(0,208,255,1) 97%,rgba(0,208,255,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(15,25,79,1) 0%,rgba(0,208,255,1) 97%,rgba(0,208,255,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(15,25,79,1) 0%,rgba(0,208,255,1) 97%,rgba(0,208,255,1) 100%); /* IE10+ */
	background: linear-gradient(top,  rgba(15,25,79,1) 0%,rgba(0,208,255,1) 97%,rgba(0,208,255,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0f194f', endColorstr='#00d0ff',GradientType=0 ); /* IE6-9 */
}


body {
	margin: 0 0 0 0;
	padding: 0 0 12px 0;
	font-family: "Lato Regular", Arial, Helvetica, sans-serif, Verdana;
	background-image: url(../images/general/deepdeep_bg.png);
	background-repeat: repeat-x;
	background-attachment:fixed;
	background-position: 0px 300px;
}

img {
	border: none;
}

#page_container {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}

#container {
	display: block;
	width: 960px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 0;
	padding: 0 0 0 0;
}

#slide_banner{
	background: #0D0F2A;
	display: block;
	width: 936px;
	padding: 0 12px 12px 12px;
}

#content_light{
	background: #003366;
	display: block;
	width: 936px;
	padding: 12px 12px 12px 12px;
	color: #a3a0b9;
	height:100%;
}

#content_dark{
	background: #0D0F2A;
	display: block;
	width: 936px;
	padding: 12px 12px 12px 12px;
	color: #a3a0b9;
	height:100%;
}

#content_separator_light {
	background: #0D0F2A url(../images/general/wave_line_light.png) repeat-x;
	display: block;
	width: 960px;
	height: 22px;
}

#content_separator_dark {
	background: #003366 url(../images/general/wave_line_dark.png) repeat-x;
	display: block;
	width: 960px;
	height: 22px;
}

#content_separator_dark_dark {
	background: #0D0F2A url(../images/general/wave_line.png) repeat-x;
	display: block;
	width: 960px;
	height: 22px;
}

.two_block {
	margin: 10px 10px 10px 10px;
	float: left;
	width: 445px;
	height: 250px;
	position: relative;
}

.three_block {
	margin: 10px 10px 10px 10px;
	float: left;
	width: 292px;
	height: 250px;
	position: relative;
}

.four_block {
	margin: 10px 10px 10px 10px;
	float: left;
	width: 214px;
	height: 214px;
	position: relative;
}

h2.midbanner { 
	font: Arial, Helvetica, sans-serif, "Lato Regular";
	font-weight: bold;
	font-size: 26px;
	text-decoration: none;
	color: #FFF;
   	position: absolute; 
   	top: 10px; 
   	left: 0; 
   	width: 400px; 
}


h2.minibanner { 
	font: Arial, Helvetica, sans-serif, "Lato Regular";
	font-weight: bold;
	font-size: 26px;
	text-decoration: none;
	color: #FFF;
   	position: absolute; 
   	top: 140px; 
   	left: 0; 
   	width: 200px; 
}

h3.midbanner { 
	font: Arial, Helvetica, sans-serif, "Lato Regular";
	font-weight: bold;
	font-size: 18px;
	color: #FFF;
	text-decoration: none;
    position: absolute; 
    top: 40px; 
   	left: 0; 
   	width: 400px; 
}

h3.minibanner { 
	font: Arial, Helvetica, sans-serif, "Lato Regular";
	font-weight: bold;
	font-size: 18px;
	color: #FFF;
	text-decoration: none;
    position: absolute; 
    top: 175px; 
   	left: 0; 
   	width: 200px; 
}

#top {
	background: url(../images/general/tab_nav.png) left bottom no-repeat;
	display: block;
	width: 960px;
	height: 160px;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}

#logo {
	display: block;
	float: left;
	height: 125px;
	margin: 10px 0 15px 15px;
	padding: 0 0 0 0;
}

#follow_nav {
	display: block;
	float: right;
	margin: 0 0 0 0;
	padding: 12px 12px 0 0;
	height: 55px;
	width: 155px;
}


/*   ------------------ footer ---------------------   */

#footer {
	background: url(../images/general/footer.png) left bottom no-repeat;
	display: block;
	width: 936px;
	height: 30px;
	margin: 0 0 0 0;
	padding: 12px 12px 0 12px;
	color: #ffffff;
	font-size: 12px;
}

.social{
float: left;
display: block;
}

.credits{
	float: right;
	display: block;
}

.credits a{
	color: #02B9E9;
}


/*   ------------------ general definitions ---------------------   */

p {
	font-size: 18px;
	padding: 10px 10px 10px 10px;
	margin: 0 0 0 0;
	text-align: justify;
}

h1 {
	/*background: url(../images/general/turtle.png) no-repeat;     !!!! change padding: 7px 10px 10px 57px   */
	font-size: 32px;
	padding: 7px 10px 10px 10px;
	margin: 0 0 0 0;
	font-weight: bold;
	color: #DADBE8;
}

h2 {
	font-size: 25px;
	padding: 7px 0 10px 10px;
	margin: 0 0 0 0;
	font-weight: bold;
	color: #DADBE8;
}

h3 {
	font-size: 20px;
	padding: 7px 0 10px 10px;
	margin: 0 0 0 0;
	font-weight: bold;
	color: #DADBE8;
}


p strong {
	font-weight: bold;
	color: #ffffff;
}

p.small {
	font-size: 14px;
}

a {
	font-style: underline;
	color: #36C6F4;
}

img.inbetween {
	padding: 20px 0 10px 0;
}

img.on_the_left {
	display: block;
	float: left;
	padding: 30px 20px 20px 10px;
}

.small {
	font-size: 12px;
}

.clear {
	clear: both;
}


/*   ------------------ about, team ------------------- */

div.about_left {
	display: block;
	float: left;
	width: 468px;
	margin: 10px;
}

div.about_right {
	display: block;
	float: left;
	width: 430px;
	padding: 0 0 0 0;
	margin: 10px 0 10px 10px;
}

div.team_left {
	display: block;
	float: left;
	width: 200px;
	margin: 0 20px 10px 10px;
}


/*   ------------------ courses ------------------- */

div.courses_left {
	display: block;
	float: left;
	width: 280px;
	margin: 10px;
}

div.courses_right {
	display: block;
	float: left;
	width: 620px;
	padding: 55px 0 0 0;
	margin: 10px 0 10px 10px;
}

div.photo_video_left {
	display: block;
	float: left;
	width: 290px;
	margin: 10px;
}

div.photo_video_right {
	display: block;
	float: left;
	width: 610px;
	padding: 10px 0 0 0;
	margin: 10px 0 10px 10px;
}



ul.list{
	padding: 0 15px 0 0;
}

ul.list li{
	list-style: none;
	/*background: url(../images/pages/courses/arrow.png) 1px 5px no-repeat;*/
	padding: 0 0 2px 15px;
	}

/*   ------------------ prices tabel ------------------- */

div.price_table {
	display: block;
	float: left;
	width: 445px;
	margin: 10px;
}

table.prices {
	border-collapse:separate;
    border-spacing:0;
	border: none;
	width: 445px;
	font-size: 14px;
	color: #ffffff;
	background-color: #0D0F2A;
	margin: 0 0 20px 0;
}

td.head, td.head a {
	color: #00BDEA;
	font-weight: bold;
	font-size: 16px;
} 

td.head {
	background-color: #004B96;
	padding: 5px 5px 5px 10px;
} 

td.price {
	font-size: 12px;
	background-color: #004B96;
	padding: 5px;
	width: 70px;
} 

td.first {
	padding: 2px 2px 2px 10px;
}

td.first_note{
	font-size: 12px;
	padding: 2px 10px 2px 10px;
	background-color: #13163F;
}

td.price_note {
	font-size: 12px;
	padding: 2px 10px 2px 2px;
	background-color: #13163F;
}

td.inbetween {
	height: 10px;
	font-size: 4px;
}

/* ------------------------ contact ------------------------ */

div.contact_info {
	display: block;
	float: right;
	width: 430px;
	margin: 10px;
}

div.contact_info h2 {
	color: #00C0FF;
	padding: 0 0 10px 0;
	font-size: 20px;
	font-weight: bold;
	display: block;
}

div.contact_info h3 {
	color: #00C0FF;
	padding: 0 0 10px 0;
	font-size: 14px;
	font-weight: bold;
	display: block;
}

/* --- form --- */

#contact_form {
	display: block;
	width: 435px;
	margin: 10px;
	padding: 10px;
	background-color: #003366;
}

#contact_form .title  {
	color: #00C0FF;
	padding: 0 0 10px 0;
	font-size: 16px;
	font-weight: bold;
	display: block;
}

#contact_form .sub_title {
	padding: 0 0 20px 0;
	font-size: 12px;
	display: block;
}

input.short{
	border: 1px solid #8d8d8d;
	background: #ffffff;
	margin: 0 10px 10px 0;
	width: 280px;
	height: 20px;
	font-size: 14px;
}

input.shorter{
	border: 1px solid #8d8d8d;
	background: #ffffff;
	margin: 0 10px 10px 0;
	width: 200px;
	height: 20px;
	font-size: 14px;
}

input.longer{
	border: 1px solid #8d8d8d;
	background: #ffffff;
	margin: 5px 10px 10px 0;
	width: 420px;
	height: 20px;
	font-size: 14px;
}

input.mini{
	border: 1px solid #8d8d8d;
	background: #ffffff;
	margin: 0 10px 10px 0;
	width: 100px;
	height: 20px;
	font-size: 14px;
}

input.tick{
	margin: 0 10px 0 0;
	font-size: 12px;
	float: left;
}

textarea{
	border: 1px solid #8d8d8d;
	background: #ffffff;
	margin: 5px 10px 10px 0;
	width: 420px;
	height: 200px;
	font-size: 14px;
}

select {
	width: 150px;
	font-size: 12px;
}

label.form{
	width: 140px;
	float: left;
	font-size: 14px;
}

label.code_check{
	width: 320px;
	float: left;
	font-size: 14px;
}

label.newsletter{
	width: 400px;
	font-size: 14px;
}

label.message{
	width: 420px;
	font-size: 14px;
}

/* --- buttons --*/

input.send{
	background: #088F00 url(../images/general/send.png) 3px 3px no-repeat;
	padding: 3px 7px 3px 27px;
	color: #FFFFFF;
	font-size: 14px;
	border: 1px solid #FFFFFF;
	cursor: pointer;
	margin: 20px 15px 20px 0;
}

input.reset{
	background: #FF5A00 url(../images/general/reset.png) 3px 3px no-repeat;
	padding: 3px 7px 3px 27px;
	color: #FFFFFF;
	font-size: 14px;
	border: 1px solid #FFFFFF;
	cursor: pointer;
	margin: 20px 10px 20px 255px;
}

input.send:hover{
	background: #0ABF00 url(../images/general/send.png) 3px 3px no-repeat;
}

input.reset:hover{
	background: #FF782F url(../images/general/reset.png) 3px 3px no-repeat;
}

/*  --- messages ---  */

.error{
	background: url(../images/general/achtung.png) no-repeat;
	display: block;
	color:#EC0000;
	padding: 2px 0 20px 27px;
	font-size: 14px;
}

.success{
	background: url(../images/general/happy.png) no-repeat;
	display: block;
	color: #00CC00;
	padding: 2px 0 20px 27px;
	font-size: 14px;
}