/* Table of Content
----------------------------------------
	#Logo/Message Styles
	#Timer Styling
	#Twitter/News
	#Social Icons
	#Contact Form
	#Media Queries
*/

/********** Logo/Message Styles **************/

#topband {
	width: 100%;
	height: 11px;
	position: absolute;
	top: -3px;
	background: #fa944d;
}

.container {
	width: 700px;
	margin: 0 auto;
}

#logo {
	width: auto;
	height: auto;
	margin: 0 auto;
	margin-top: 85px;
}

#logoheader {
	margin: 0 auto;
	width: 100%;
	text-align:center;
	text-transform:uppercase;
}

#logoheader p {
	padding-top: 20px;
	font-family: 'Arial';
	font-size: 36px;
	color: #FFF;
}

#message {
	width: 648px;
	margin: 0 auto;
	color: #FFF;
	font-family:'Montserrat', sans-serif;;
	font-size: 28px;
	border-top: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
	margin-top: 75px;
	
}

#message p {
	padding-top: 10px;
	padding-bottom: 10px;
        text-align: center;
}

/********** Timer Styling **************/

#clock {
	width:648px;
	margin: 0 auto;
	margin-top: 40px;
}

#weekscontainer {
	width: 100px;
	height: 100px;
	float: left;
	margin-right: 37px;
}

#weeks {
	width: 98px;
	height: 100px;
	border-left: 1px solid #9D9D9D;
	border-right: 1px solid #9D9D9D;
	border-bottom: 1px solid #9D9D9D;
	opacity: .6;
}

#weeksclockband {
	width: 100%;
	height: 10px;
	background-color: #fa944d;
	opacity: 1;
}

#dayscontainer {
	width: 100px;
	height: 100px;
	float: left;
	margin-right: 37px;
}

#days {
	width: 98px;
	height: 100px;
	border-left: 1px solid #9D9D9D;
	border-right: 1px solid #9D9D9D;
	border-bottom: 1px solid #9D9D9D;
	opacity: .6;
}

#daysclockband {
	width: 100%;
	height: 10px;
	background-color: #fa944d;
	opacity: 1;
}

#hourscontainer {
	width: 100px;
	height: 100px;
	float: left;
	margin-right: 37px;
}

#hours {
	width: 98px;
	height: 100px;
	border-left: 1px solid #9D9D9D;
	border-right: 1px solid #9D9D9D;
	border-bottom: 1px solid #9D9D9D;
	opacity: .6;
}

#hoursclockband {
	width: 100%;
	height: 10px;
	background-color: #fa944d;
	opacity: 1;
}

#minutescontainer {
	width: 100px;
	height: 100px;
	float: left;
	margin-right: 37px;
}

#minutes {
	width: 98px;
	height: 100px;
	border-left: 1px solid #9D9D9D;
	border-right: 1px solid #9D9D9D;
	border-bottom: 1px solid #9D9D9D;
	opacity: .6;
}

#minutesclockband {
	width: 100%;
	height: 10px;
	background-color: #fa944d;
	opacity: 1;
}

#secondscontainer {
	width: 100px;
	height: 100px;
	float: left;
}

#seconds {
	width: 98px;
	height: 100px;
	border-left: 1px solid #9D9D9D;
	border-right: 1px solid #9D9D9D;
	border-bottom: 1px solid #9D9D9D;
	opacity: .6;
}

#secondsclockband {
	width: 100%;
	height: 10px;
	background-color: #fa944d;
	opacity: 1;
}

.triangle {
	width: 0; 
	height: 0; 
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-top: 10px solid #fa944d;
	position: relative;
	z-index: 10;
	margin: 0 auto;
	margin-bottom: -10px;
}

.triangle2 {
	width: 0; 
	height: 0; 
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-top: 14px solid #fa944d;
	position: relative;
	z-index: 10;
	margin: 0 auto;
	margin-bottom: -10px;
}

#timer {
	font-family: 'Arial';
	font-size: 40px;
	font-weight: bold;
	color: #FFF;
	background: none;
	border: none;
	position: relative;
	top: -69px;
	left: 1px;
	width: 705px;
}

.units {
	font-family: 'Arial';
	color: #FFF;
	font-size: 17px;
	text-align: center;
	padding-top: 7px;
}

/********** Twitter/News **************/

#newscontainer {
	width: 648px;
	height: 65px;
	margin:0 auto;
	margin-top: 120px;
}

.safari #newscontainer {
	margin-top: 240px;
}

#news {
	width: 647px;
	height: 65px;
	border-left: 1px solid #9D9D9D;
	border-top: 1px solid #9D9D9D;
	border-right: 1px solid #9D9D9D;
	opacity: .7;
	margin:0 auto;
	color: #fff;
	text-align: center;
	font-family: 'Arial';

}

#tweets {
	width: 648px;
	height: 65px;
	position: relative;
	overflow-y: hidden;

}

.rrt-inner {
	position: relative;
	padding: 10px;
}

#news a {
	color: #fa944d;
	text-decoration: none;
}

#tw {
	margin-top: 10px;
}

#newsband {
	position: relative;
	height: 10px;
	width: 100%;
	background-color: #fa944d;
	margin-top: -10px;

}

#newsheading {
	font-family: 'Montserrat', sans-serif;;
	color: #FFF;
	font-size: 20px;
	text-align: center;
	padding-top: 15px;
}

/********** Social Icons **************/

#socialicons {
	width: 667px;
	height: 52px;
	margin: 0 auto;
	margin-top: 20px;
        text-align: center;
}
#socialicons div {
    display: inline-block;
    float: none !important;
    margin-right: 8px;
}
#socialicons div:last-child {
    margin-right: 0;
}
#facebook {
	width: 52px;
	height: 52px;
	border: 1px solid #9D9D9D;
	-moz-transition: all .2s ease-in-out 0s;
	-webkit-transition: all .2s ease-in-out 0s;
	
}

#facebook:hover {
	background-color: #385998;
}

#twitter {
	width: 52px;
	height: 52px;
	border: 1px solid #9D9D9D;
	-moz-transition: all .2s ease-in-out 0s;
	-webkit-transition: all .2s ease-in-out 0s;
}

#twitter:hover {
	background-color: #34CCFE;
}

#dribbble {
	width: 52px;
	height: 52px;
	border: 1px solid #9D9D9D;
	-moz-transition: all .2s ease-in-out 0s;
	-webkit-transition: all .2s ease-in-out 0s;
}

#dribbble:hover {
	background-color: #EA4C89;
}

#behance {
	width: 52px;
	height: 52px;
	border: 1px solid #9D9D9D;
	-moz-transition: all .2s ease-in-out 0s;
	-webkit-transition: all .2s ease-in-out 0s;
}

#behance:hover {
	background-color: #696F75;
}

#skype {
	width: 52px;
	height: 52px;
	border: 1px solid #9D9D9D;
	-moz-transition: all .2s ease-in-out 0s;
	-webkit-transition: all .2s ease-in-out 0s;
}

#skype:hover {
	background-color: #00AFF0;
}

#deviant {
	width: 52px;
	height: 52px;
	border: 1px solid #9D9D9D;
	-moz-transition: all .2s ease-in-out 0s;
	-webkit-transition: all .2s ease-in-out 0s;
}

#deviant:hover {
	background-color: #5E7163;
}

#youtube {
	width: 52px;
	height: 52px;
	border: 1px solid #9D9D9D;
	-moz-transition: all .2s ease-in-out 0s;
	-webkit-transition: all .2s ease-in-out 0s;
}

#youtube:hover {
	background-color: #BD0903;
} 

#instagram {
	width: 52px;
	height: 52px;
	border: 1px solid #9D9D9D;
	-moz-transition: all .2s ease-in-out 0s;
	-webkit-transition: all .2s ease-in-out 0s;
}

#instagram:hover {
	background-color: #4D7B9F;
}

#linkedin {
	width: 52px;
	height: 52px;
	border: 1px solid #9D9D9D;
	-moz-transition: all .2s ease-in-out 0s;
	-webkit-transition: all .2s ease-in-out 0s;
}

#linkedin:hover {
	background-color: #3282A0;
}

#email {
	width: 52px;
	height: 52px;
	border: 1px solid #9D9D9D;
	-moz-transition: all .2s ease-in-out 0s;
	-webkit-transition: all .2s ease-in-out 0s;
}

#email:hover {
	background-color: #00A12A;
}


/********** Contact Form **************/

#contact {
	margin: 0 auto;
	width: 509px;
	margin-top: 30px;
	font-family: 'Arial';
	padding-bottom: 5px;
}

.ie #contact {
	width: 508px;
}

.ie8 #contact {
	width: 508px;
}

.ie7 #contact {
	width: 508px;
}

.ie6 #contact {
	width: 508px;
}

.ie5 #contact {
	width: 508px;
}

#responsemessage {
	display: none;
	color: #fff;
	font-size: 13px;
	text-transform: uppercase;
}

#contact input {
	width: 358px;
	height: 34px;
	border: 1px solid #9D9D9D;
	font-size: 14px;
	font-family: 'Arial';
	margin-right: 7px;
	padding-left: 10px;
	background: none;
	color: #fff;
}

#contact input.submit { 
	width: 125px;
	height: 34px;
	border: none;
	margin-right: 0px;
	background-color: #fa944d;
	color: #fff;
	font-size: 14px;
	font-family: 'Arial';
	cursor: pointer;
}

#contact input.submit:hover {
	background-color: #565656;
}

#copyrighttext {
	font-family: 'Arial';
	font-size: 13px;
	color: #FFF;
	text-align: center;
	margin-top: 40px;
}

input {-webkit-appearance: none; border-radius: 0;}

/******* Media Queries *********/

@media only screen and (max-width: 400px) {
		.container { width: 300px;}
		#tweets {width: 300px;}
		#tweets ul {width: 300px; font-size: 11px;}
		#timer {font-size: 18px; top: -25px; left: -12px; width: 320px;}
		#weeks { width: 48px; height: 50px;}
		#hours { width: 48px; height: 50px;}
		#minutes { width: 48px; height: 50px;}
		#seconds { width: 48px; height: 50px;}
		#days { width: 48px; height: 50px;}
		#weekscontainer { width: 50px; height: 50px; margin-right: 12px;}
		#hourscontainer { width: 50px; height: 50px; margin-right: 12px;}
		#minutescontainer { width: 50px; height: 50px; margin-right: 12px;}
		#secondscontainer { width: 50px; height: 50px;}
		#dayscontainer { width: 50px; height: 50px; margin-right: 12px;}
		.units {font-size: 10px;}
		#clock {width: 300px; margin-top: 25px;}	
		.safari .hasCountdown { margin-right: -18px;}	
		.hasCountdown {margin-right: -16px;}	
		#message {font-size: 13px; width: 296px; margin-top: 10px; text-align: center;}
		#news {width: 298px; height: 70px;}
		#newscontainer {width: 300px; margin-top: 80px;}
		.rrt-inner {font-size: 12px; padding: 12px;}
		.safari #newscontainer { margin-top: 120px;}
		#logo {height: 80px; width: 80px; margin-top: 20px;}
		#logo img {height: 80px; width: 80px;}
		#contact {width: 300px;}
		#contact input {width: 290px; margin:0 auto;}
		#contact input.submit {margin-top: 7px; width: 303px;}
		#responsemessage {width: 300px; font-size: 12px;}
		#newsband {margin-top: -5px;}
		.triangle2 { top: 5px;}
		#newsheading {padding-top: 20px;}
		#socialicons {width: 257px; height: 86px; }
		#socialicons div {margin-right: auto; }
		input {-webkit-appearance: none; border-radius: 0;}
		#copyrighttext {margin-top: 20px;}
		#facebook { width: 40px; height: 40px;}
		#facebook img {width: 40px; height: 40px;}
		#twitter { width: 40px; height: 40px;}
		#twitter img {width: 40px; height: 40px;}
		#dribbble { width: 40px; height: 40px;}
		#dribbble img {width: 40px; height: 40px;}
		#behance { width: 40px; height: 40px;}
		#behance img {width: 40px; height: 40px;}
		#skype { width: 40px; height: 40px; margin-right: 0px;}
		#skype img {width: 40px; height: 40px;}
		#deviant { width: 40px; height: 40px; margin-top: 14px;}
		#deviant img {width: 40px; height: 40px;}
		#youtube { width: 40px; height: 40px; margin-top: 14px;}
		#youtube img {width: 40px; height: 40px;}
		#instagram { width: 40px; height: 40px; margin-top: 14px;}
		#instagram img {width: 40px; height: 40px;}
		#linkedin { width: 40px; height: 40px; margin-top: 14px;}
		#linkedin img {width: 40px; height: 40px;}
		#email { width: 40px; height: 40px; margin-right: 0px; margin-top: 14px;}
		#email img {width: 40px; height: 40px;}		

   }

@media only screen and (min-width: 401px) and (max-width: 767px) {
		#contact {width: 510px;}
		input {-webkit-appearance: none; border-radius: 0;}
		
   }

@media only screen and (min-width: 768px) and (max-width: 1500px) {
   		#contact {width: 514px;}
		input {-webkit-appearance: none; border-radius: 0;}
  }

